Jquery Sortable，通过拖出删除当前项

我的问题：可排序的事件：当我在列表中拖动某些内容或对列表进行排序时触发。 但我只想在拖出项目时启动该function。

我的代码

$(document).ready(function ust() { $('#div1').sortable({ out: function(event, ui) { $('#nfo').append('OUT
'); } }); }); 

工作示例http://jsfiddle.net/FrbW8/22/

Answer 1

这是out回调的默认行为。 看到这个jquery ui trac票

我真的不同意’逻辑’行为的概念。

“但是，请注意，如果您拖入列表然后释放鼠标，仍然会触发”out“回调（但如果您没有在列表上方则不会）。这是逻辑行为，也适用于普通的可排序。 “

Answer 2

使用beforeStop拦截项目并将其删除：

 receive: function(e, ui) { sortableIn = 1; }, over: function(e, ui) { sortableIn = 1; }, out: function(e, ui) { sortableIn = 0; }, beforeStop: function(e, ui) { if (sortableIn == 0) { ui.item.remove(); } } 

（我最初在谷歌找到了这个，但是再也找不到链接了。所以，我为没有引用来源而道歉。）

Answer 3

其他解决方案似乎不适用于连接的可排序列表，所以我发布了我自己的解决方案，完全适合我的情况。 这使得“droppable”插件在元素被丢弃到可排序列表之外时捕获“drop”事件。

 $('#div1').sortable({ .... }).droppable({greedy: true}) $('body').droppable({ drop: function ( event, ui ) { ui.draggable.remove(); } }); 

以下是这种方法的实践： http ： //jsfiddle.net/n3pjL/

Answer 4

我使用this.element.find('.ui-sortable-helper').length来区分“sort out event”和“drop out event”。 在排序时，已排序的项目具有类ui-sortable-helper。 在删除之后，没有其他ui-sortable-class，直到你再次开始排序（至少在我的脚本中）。 希望能帮助别人。