jQuery UI的：移动从一个列表项到另一个

Question

虽然这应该是相对简单的，我无法弄清楚如何UL S之间移动（而不是复制）LI元素。

所有我想要的是从列表富拖动任何项目列出巴（反之亦然），而不用复制的元素。

虽然connectToSortable做几乎正是我想要的（虽然我宁愿避免sortable），它克隆元素 - 和反应的stop事件手动删除原始元素原来是不那么容易（例如保证实际发生的有效下降）。

一个简单的“hello world”例子会对我有很大的帮助。

Answer 1

您可以在这里找到Hello World示例：http://jqueryui.com/demos/sortable/#connect-lists。您根本不需要draggable，只需要sortable。

$(function() { 
    $("#sortable1, #sortable2").sortable({ 
     connectWith: '.connectedSortable' 
    }).disableSelection(); 
}); 

如果您想禁止一个列表中的项目排序，这可能是一种方法。虽然这不是最漂亮的用户界面（用户被给予错误的希望），并且用户也可以自由确定外部列表中的放置位置。

$(function() { 
    var sender; 
    var recvok = false; 
    $("#sortable1, #sortable2").sortable({ 
     connectWith: '.connectedSortable', 
     start: function() { 
      sender = $(this); 
      recvok = false; 
     }, 
     over: function() { 
      recvok = ($(this).not(sender).length != 0); 
     }, 
     stop: function() { 
      if (!recvok) 
       $(this).sortable('cancel'); 
     } 
    }).disableSelection(); 
}); 

这是一个非常可怕的函数，解决了我觉得在jQuery UI中不完整的问题。它将发件人保存在sortstart上，并取下允许放下的标志。当输入另一个接收者时，它检查它是否不是发送者并且放置标志。在sortstop上检查标志。警告：这个函数对于用户和程序员来说都是丑陋的，但它起作用。