Question

我正在尝试使用jquery-ui。我正在使用其中一个拖放示例，这正是我所需要的，除了在两个列表之间移动项目，我想要克隆的项目：

http://jqueryui.com/demos/sortable/#connect-lists

$(function() {
    $("#sortable1, #sortable2").sortable({
        connectWith: '.connectedSortable'
    }).disableSelection();
});

<ul id="sortable1" class="connectedSortable">
  <li class="ui-state-default">Item 1</li>
  <li class="ui-state-default">Item 2</li>
  <li class="ui-state-default">Item 3</li>
</ul>

<ul id="sortable2" class="connectedSortable">
  <li class="ui-state-default">Item 1</li>
  <li class="ui-state-default">Item 2</li>
  <li class="ui-state-default">Item 3</li>
</ul>

所以将项目从第一个列表移动到第二个列表导致列表1有2个项目，列表2有4个项目。我只是想让它在下落上制作物品的克隆。所以在上面的例子中，列表1仍然有3个项目，但列表2将有4个项目，

谢谢

Answer 1

这不是你完美的答案，但我需要类似的东西...... 向sortable添加remove（）处理程序将允许您克隆即将被删除的元素。试试这个：

$(function() {
    $("#sortable1, #sortable2").sortable({
        connectWith: '.connectedSortable',
        remove: function(event,ui){
       ui.item.clone().appendTo('#sortable1');
    }
    }).disableSelection();
});

如果将项目从sortable1拖到sortable2，则在放下它时它将被添加到sortable1的底部。拖动开始时克隆项目最有意义，如果拖动不成功则删除克隆。但是当你开始拖拽时我找不到发生的事件。

jquery-ui拖放 - 如何丢弃物品？

1 个答案: