jQuery-ui 可排序可拖动模块遇到多个问题？

Question

（总而言之，我的问题可以在这里查看： http://jsfiddle.net/F5Wve/12/）

所以我试图修复我正在与我的朋友一起工作的网站上运行的代码，FriendGrid ，我们使用 jQuery-UI 在三列界面中添加可排序模块，不幸的是，当我使用此 jQuery 为排列在列内的模块启动可拖动界面时，我的代码遇到了一些奇怪的错误与 connectWith 连接时会遇到这样的问题：模块在移动后会克隆自己，而它们只应该被移动：

$(".module").draggable({
    handle: $(this).children(".draghandle"),
    opacity: 0.5,
    helper: 'clone',
    revert: 'invalid',
    connectToSortable: '.column'
});

然后当我使用下一个代码来启动它而不是克隆模块时，它首先看起来会移动它，然后它完全删除它：

$(".module").draggable({
    handle: $(this).children(".draghandle"),
    opacity: 0.5,
    helper: 'original',
    revert: 'invalid',
    connectToSortable: '.column'
});

所以无论哪种方式，它都会忽略移动它，因为人们可能会注意到我更改的选项是助手，这也是所有这一切的主要因素，但如果助手是克隆，它应该只使用克隆本身被拖动，如果它设置为原始，它应该将模块完全移出它所在的位置并拖动模块本身，但我不明白为什么它会导致这些奇怪的问题，当前的设置该网站是克隆的，但您当然会必须创建一个帐户才能测试它，如果您希望可以立即删除该帐户，一旦您进入该网站，您需要调用 javascript 函数 ModularMode()，如果您不知道如何调用该函数通过输入“javascript: ModularMode();”即可轻松完成进入您的浏览器（不带引号）。希望我能得到一些有用的回复，谢谢。

Answer 1

无论如何，您通过声明元素可拖动和可排序来重复工作。可排序具有所有相同的选项，因此您也可以在那里指定它们。您在使用脚本时遇到如此多麻烦的原因可能是表格单元格往往会导致库用于创建您想要的行为的 CSS 定位属性类型出现问题。我什至无法开始猜测克隆。但是，我已经成功地通过使用稍微不同的标记（无序列表）和元素定位来完成您尝试做的事情。您可以轻松地使用 div 包裹其他 div，但将所有列容器向左浮动，效果应该很好。 查看示例小提琴。

与许多可排序元素一样，拖动的元素并不总是能轻松地捕捉到列表的底部，但它是可行的。您需要为列指定宽度和最小高度属性，以便当您从其中拖动所有元素时它们不会消失。