jQuery UI可排序 – 无法将元素拖动到连接列表/列的底部

我遇到了jQuery sortables的问题。 我正在使用它通过创建3列来开发类似iGoogle的仪表板。 所有3都包含可排序的div，并使用connectWith选项相互连接。

我遇到的问题是当尝试在可排序列的底部删除div时; 它只是不想发生。 只有当我将它拖过已经在我拖动到的列表中的最底部的div时，它才有效。

有什么方法可以避免这种情况吗？ 或者也许创建一个固定在每列底部的虚拟div？ 任何有关这方面的帮助将非常感谢！

提前致谢。

Answer 1

老问题但也许可以帮助别人……

填充有效，但会改变您的视觉处理。

另一种解决方案是使用可排序的api提供的“容差”。 “指针”的容差值意味着只要用户光标位于其他元素之一上，该项就可以替换其位置（而不是元素上的一定空间，这是您在没有填充的情况下遇到麻烦的原因） 。

尝试将此添加到初始化（在我的示例中，我垂直排序列表）。

$(this.$el).sortable({ axis: 'y', cursor: 'move', containment: 'parent', tolerance: 'pointer' // this is the important bit }); 

这样做之后应该非常活泼。

你也可以在这里看到jquery文档： http ： //api.jqueryui.com/sortable/#option-tolerance

Answer 2

包含div的列需要一个相当大的填充底部，以将可拖动区域扩展到底部div之外。 否则，列紧紧地拥抱div，每个底部div下面的区域位于可排序列表之外。