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

回答

相关问题