jquery多個可拖拽和排序

隨着jquery Draggable和排序我想做一個系統，學生可以回答一個問題（藍框）與多個答案（紅色框）和排序答案。藍箱的數量是未知的，因此我做了一個名爲'容器'的類。jquery多個可拖拽和排序

我已經設置它，把它放在的jsfiddle：http://jsfiddle.net/smethorst/h3ZNd/2/

HTML

<ul id="answers"> 
    <li>Item 1 (+)</li> 
    <li>Item 2 (+)</li> 
    <li>Item 3 (+)</li> 
    <li>Item 4 (+)</li> 
</ul> 

<ul class="container"> 
</ul> 
<ul class="container"> 
</ul>

JQuery的 $（函數（）{

$("#answers li").draggable({ 
     connectToSortable: '.container', 
     helper: 'clone', 
     revertDuration: 0 
    }); 

    $(".container").sortable({ 
     revert: true 
    }); 

    $(".container li").draggable({ 
     connectToSortable: '.container', 
     revert: "invalid", 
    }); 
});

我有解決方案的地方jsfiddle： http://jsfiddle.net/smethorst/h3ZNd/2/

因此，問題在於無法將答案拖放到其他問題框中。所以在將一個項目從紅色框拖到藍色框後，應該可以將其拖到另一個藍色框（無克隆）。

我已經下降後，嘗試不同的東西，像這些東西，但它沒有工作：

$(this).append($(ui.draggable)); 
$(".container").sortable('refresh');

是否有它的解決方案？提前致謝。

來源

2013-07-28 Stefan

簡單，有一個可排序的選項，您可以使用：connectWith。它接受一個選擇器，連接其他sortables：

$(".container").sortable({ 
    connectWith: '.container', 
    revert: true 
});

JSFiddle

你的下一個問題可能會是，每一個盒子應該只接受一個元素。所以你需要刪除一個元素的動態排序中的其他元素，這比我想象的要複雜。

來源

2013-07-28 10:37:49 nirazul

謝謝，這是一個很好的解決方案！每個盒子應該多次接受一個元素，所以這沒有任何問題。但是，當有一些默認變量發生了另一個問題，這些項目將互相摺疊。當一件物品從一個藍色箱子移動到另一個時，一件物品會消失。 http://jsfiddle.net/smethorst/h3ZNd/6/ – Stefan

似乎是一個jQuery的UI錯誤... – nirazul

jquery多個可拖拽和排序

回答

相關問題