jQuery的拖放

我有以下...jQuery的拖放

<ul> 
    <li>Item</li> 
    <li>Item</li> 
    <li>Item</li> 
</ul> 
<ul> 
    <li>Item</li> 
    <li>Item</li> 
    <li>Item</li> 
</ul> 
<ul> 
    <li>Item</li> 
    <li>Item</li> 
    <li>Item</li> 
</ul>

我需要從一個ul到另一個拖動每個項目，但要避免重複在同一ul，只是添加的項目滴下的UL認證。

使用jQuery我已經嘗試了很多東西，但總是有些東西混淆了它。

有什麼想法？日Thnx

來源

2010-11-04 Val

你可以使用jQueryUI的 http://jqueryui.com/demos/sortable/

使得它很容易的DragDrop /調整/下跌...

來源

2010-11-04 05:41:35 Breezer

sortables很好地工作，但問題是，每次我掉了什麼東西有重複的項目 – Val 2010-11-04 05:47:43

這是複雜的，因爲你有多個sortables，它是棘手的工作。我已經使用帶有connectTo選項的可排序控制器來指定其他可能的目標。

來源

2010-11-04 05:47:07 hybernaut

我舒適的使用sortables但唯一的問題是，我只需要一個副本項目。所以如果該項目已經存在，我可以顯示一個錯誤或忽略拖動 – Val 2010-11-04 05:49:25

我有一段時間沒有這樣做，所以我的記憶有點朦朧，但我認爲你可以勾上「接收」或「放下」事件目標，做一些驗證，並返回false來拒絕拖動。 – hybernaut 2010-11-04 05:58:28

嘗試刪除重複前添加

$("li").draggable({ 
appendTo: "ul", 
helper: "clone" 
}); 
$("ul").droppable({ 
activeClass: "ui-state-default", 
hoverClass: "ui-state-hover", 
accept: ":not(.ui-sortable-helper)", 
drop: function(event, ui) { 
    $(this).find("li:contains('" + ui.draggable.text() + "')").remove(); 

    $("<li></li>").text(ui.draggable.text()).appendTo(this); 
} 
})

來源

2010-11-04 05:54:13 jargalan

回答

相關問題