Question

我有两列可拖动的li元素。当我将一个元素从一列拖到另一列时，我需要克隆拖动的元素并将其附加到新列（我希望元素也保留在前一列中）。

     ls.droppable({      // ls refers to the column containing draggable elements
         greedy:true,
         hoverClass: 'drop-hover',
         over: function (e, u) {

         },
         drop: function (e, u) {

             afterDrop(u, $(this));
         }
   });

afterDrop函数是

      window.afterDrop = function (u, ls) {
      var c = u.draggable.clone(true, true);
      var d = jQuery('.onestrip', ls);
      d.append(c);
      }

现在当我拖动另一列中新添加的元素时，会拖动上一列中的旧元素。如何将单独的可拖动附加到拖动的元素（我尝试禁用然后再次附加拖动，但仍然相同）

编辑：我提出了类似的情况，看看这个链接http://jsbin.com/aseqid/4/edit .... 尝试将红色框拖放到绿色框中。然后再次尝试拖动之前删除的红色框...拖动事件未附加到丢弃的红色框...我已尝试将事件附加到已删除的框中，但它仍然引用原始的红色框

Answer 1

这是您正在寻找的行为吗？

已将'ID'测试更改为'class'并进行了一些调整

我已更新您的代码

http://jsbin.com/aseqid/10/edit

Answer 2

我相信它的表现就是这样，因为你用可拖动的数据和事件克隆了新的附加元素。

尝试使用clone()代替clone(true, true)，并初始化新元素所需的数据和事件，而不是全部克隆它们。

http://jsbin.com/aseqid/8/edit

drop:function(e,u){
    var a=u.draggable.clone();
    a.removeAttr('id'); // Remove the id attribute, no dup 'id'
    initialize(a);      // Create an initialize function, or do it in here
    console.log(e.target)
    $(this).append(a);
}

拖动克隆元素（ui.draggable.clone（））拖动原始元素（jquery）

2 个答案: