Jquery Draggable - 如何动态创建一个新的可拖动div，然后可以拖动？

Question

我正在使用jquery，draggable和droppable创建一个日程计划器。

将作业从未分配列拖动到小时时段时，将删除原始可拖动项目，并将新div放入页面，并显示作业详细信息。

这个新创建的div代码块，其中包含所有参数以使其可拖动。当它在页面加载时呈现时，这些分配的作业是可拖动的。

只有在使用javascript动态创建它们时才会发生阻止它们被拖拽的事情。

当我使用Javascript动态创建这些新的div标签时，我是否需要做些什么来告诉jquery这些新项目是否应该被拖动？

（一如既往地感谢）

步骤

• 我们有一个div容器，里面有一个作业列表（更多div）。 #unassignedjobs是这些作业的父div，其中包含以下作业：＃jobN，＃jobN2，＃jobN3
• 我们还有另一个区域，我们可以放下这些项目，在这个区域内是一个用于显示工作的容器，每个人，我们称之为＃person1和＃person2。
• 目的是从未分配的职位列表中拖出职位，并将其放入人员职位列表中
• 在我执行此操作的那一刻，我刷新项目被删除时＃person1内的所有html并使用ajax / php重新创建此人的作业列表（＃person1 ）并使用 innerHTML 重新填充＃person1。

• 每次从php创建页面时，＃person1中的任何作业都会在激活jquery时出现，使它们可以拖动。 仅在运行innerHTML的刷新和重新填充时，才能拖动项目（#jobN或＃jobN2）

  var createdContent = httpRequest.responseText;

  jobcolp.innerHTML = createdContent;

希望这会让问题更加清晰。

Answer 1

只需将draggable应用于新创建的DIV即可。如果DIV完全相同，除了位置，你也可以不重新创建它，只是重新定位它。这将保留所有的处理程序。

 // remove, reposition, reapply handlers
 $('#jobN').remove().appendTo('#dayViewN').draggable();

或

 // reposition, retain handlers
 $('#jobN').appendTo('#dayViewN');

Answer 2

为什么不禁用可拖动的而不是替换新的div？

$(element).draggable('disable');

然后当你想让它成为可拖动的agian时，请使用此

$(element).draggable('enable');