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上檢查標誌。警告：這個函數對於用戶和程序員來說都是醜陋的，但它起作用。