的jQuery UI 1.7 1.8可拖動，可放開和排序共存

可能重複：
Drag and Drop between Multiple Lists and Sortable 的jQuery UI 1.7 1.8可拖動，可放開和排序共存

我想有一個包含其相應的元素兩盒。我想這些元素可排序和可拖動到另一個容器（在那裏他們將能夠進行排序與他們的新隊友）

我有這樣的代碼： http://jsfiddle.net/Q63nc/

但似乎沒有采取「可排序」屬性，此外，一旦我移動一個藍色框，我不能拖動它了。爲什麼這個？

非常感謝您的耐心提前！

來源

2011-12-14 Andrea Silvestri

您遇到的問題with sortable是您指定了錯誤的類。您需要選擇列表，而不是列表中的項目。

要獲得您想要的功能，請查看the sortable connectWith property。

的connectWith選項的描述：

注意到jQuery選擇與也具有施加sortables項目。如果使用，可排序現在連接到另一個單向，所以你可以從這個排序拖到另一個。

這是一個新的小提琴，顯示它的工作 - http://jsfiddle.net/huWYN/。

$(function(){ 
    $("#left-side, #right-side") 
     .sortable({ 
      axis: "x", 
      connectWith: ".droppable" 
     }) 
     .disableSelection(); 
});

我加disableSelection所以你不小心的事情高亮顯示在列表中，當你四處移動它們。它只是讓經驗更順暢。您可能希望對整個容器都執行此操作。這兩個列表都在。

disableSelection尚未記錄，但它是the jQuery UI Core as of 1.7的一部分。

從this thread post on the function：

它是使文本元素，或包含文本元素有用的，而不是文本可選擇。例如，如果您有可拖動的元素，則當用戶拖動元素時，您可能不希望文本選擇發生。

來源

2011-12-14 21:28:25

哇，我簡直不敢相信它！但我有一個好奇心：「connectWith」做什麼？ –

我鏈接到解釋這個演示。點擊底部的「選項」標籤。我會將該信息添加到答案中。 –

的jQuery UI 1.7 1.8可拖動，可放開和排序共存

回答

相關問題