我正在使用 jquery 创建一个可拖动和可放置的日程安排器。
当作业从未分配的列拖动到小时时间段中时,原始的可拖动项目将被删除,并且新的 div 会被放置到页面中,其中包含作业详细信息。
这个新创建的 div 代码块中包含使其可拖动的所有参数。当它在页面加载上呈现时,这些分配的作业是可拖动的。
只有当使用 JavaScript 即时创建它们时,才会发生阻止它们被拖动的情况。
当我使用 Javascript 即时创建这些新的 div 标签时,我需要做些什么来告诉 jquery 这些新项目要被拖动吗?
(一如既往地提前致谢)
步骤
- 我们有一个 div 容器,里面有一个作业列表(更多 div)。 #unassignedjobs 是这些作业的父 div,里面有以下作业,#jobN ,#jobN2, #jobN3
- 我们还有另一个区域,可以将这些项目放入其中,该区域内有一个用于显示每个人的职位的容器,我们将其称为#person1 和 #person2。
- 目的是从未分配的职位列表中拖动职位,并将其放入职位的人员列表中
- 当我执行此操作时,当删除某个项目时,我会刷新#person1 内的所有 html,并使用 ajax/php 重新创建此人的工作列表(#person1 )并使用innerHTML重新填充#person1。
每次从 php 创建页面时,当激活 jquery 时,#person1 中的任何作业都会出现,从而使它们可拖动。 只有当刷新并重新填充innerHTML时,项目(#jobN或#jobN2)才无法拖动
var createContent = httpRequest.responseText;
jobcolp.innerHTML =createdContent;
希望这能让问题更加清晰。
最佳答案
只需将draggable应用于新创建的DIV即可。如果DIV除了位置之外完全相同,您也可以不重新创建它,而只是重新定位它。这将保留它的所有处理程序。
// remove, reposition, reapply handlers
$('#jobN').remove().appendTo('#dayViewN').draggable();
或
// reposition, retain handlers
$('#jobN').appendTo('#dayViewN');
关于Jquery Draggable - 如何动态创建一个新的可拖动 div,然后可以拖动?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/1927662/