jqueryUI：从对话框拖动元素并放到主页面上？

Question

我正在尝试创建一个由工作区和“调色板”组成的拖放系统。工作区当前包含可重新订购的列表项，我希望调色板是一个浮动窗口，我可以从中拖动项目并将它们添加到工作区中的特定位置。

我目前正在使用工作区的 jqueryUI“可排序”插件和调色板的 jqueryUI“对话框”插件。

但是，我无法将从对话框中拖出到主页面。当我尝试时，被拖动的项目在越过对话框的边界时消失（这是有道理的）。当我将它们拖出调色板时，我可以更改哪些项目仍然可见和允许我将它们拖放到主工作区？

或者，是否有任何jquery插件提供这种拖放调色板作为主要功能？

Answer 1

如果从调色板拖动项目重复它们，而不从调色板中删除它们，则答案是draggable plugin的appendTo选项。这指定了在拖动期间使用的容器。在我的例子中，我在对话框的边界之外创建了一个新的div，并将其指定为拖动容器。这允许元素成为超出对话窗口范围的药物。

要将 移动项目从调色板移到工作区，我使用了此similar SO question中的技巧。