代码之家 › 专栏 › 技术社区 › Val

jquery拖放

drag-and-drop jquery

Val · 技术社区 · 15 年前

我有以下内容…

<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

3 回复 | 直到 12 年前

Breezer 15 年前

您可以使用jqueryui http://jqueryui.com/demos/sortable/

使拖动/调整大小/放置非常容易…

hybernaut 15 年前

这很复杂,因为你有多个分拣机,很难开始工作。我已经使用可排序控制器和指定其他可能目标的connectto选项完成了这项工作。

jargalan 15 年前

添加前尝试删除重复项

$( "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 );
 }
})

推荐文章

code-geek · Jquery根据单选按钮选择隐藏或显示文本字段

8 月前

Dr.0000FF · jQuery按钮点击不显示/隐藏内容

9 月前

user28928120 · 如何在jquery中选择所有类?

9 月前

LauraNMS · 如何使用Waypoints js实现粘性元素和偏移量

9 月前