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

时间:2011-10-25 23:30:46

标签: javascript jquery jquery-ui jquery-ui-sortable jquery-ui-draggable

(总之,我的问题可以在这里查看:http://jsfiddle.net/F5Wve/12/

所以我正在尝试修复我正在与我的朋友调用的网站上运行的代码FriendGrid ,我们正在使用jQuery-UI在三列接口中添加可排序模块,不幸的是我在使用我的代码时遇到了一些奇怪的错误,当我使用这个jQuery启动可拖动的接口时,模块被安排在列内部与connect连接它会遇到模块在移动后克隆自己的问题,只应移动它们:

$(".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();”轻松完成进入你的浏览器(没有引号)。我希望我能得到一些有用的回复,谢谢。

1 个答案:

答案 0 :(得分:1)

对于它的价值,你通过声明你的元素可拖动和可排序来重复工作。 Sortables具有所有相同的选项,因此您可以在那里指定它们。您在脚本上遇到这么多麻烦的原因很可能是表格单元格倾向于使用库用来创建所需行为的CSS定位属性产生问题。我甚至无法开始推测克隆。但是,我已经设法通过使用稍微不同的标记(无序列表)和元素定位来完成您尝试做的事情。您可以轻松地使用div包装其他div,但是将所有列容器浮动,它应该可以正常工作。 Check out the example fiddle

与许多sortables一样,拖动的元素并不总是容易捕捉到列表的底部,但它是可行的。您需要为列指定宽度和最小高度属性,以便在从中拖动所有元素时它们不会消失。