0

ドラッグ可能なli要素を持つ2つの列があります。ある列から別の列に要素をドラッグするときは、ドラッグした要素のクローンを作成して新しい列に追加する必要があります（要素を前の列にも残したい）。

     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 ....赤いボックスを緑のボックスにドラッグアンドドロップしてみてください。次に、前にドロップした赤いボックスをもう一度ドラッグしてみてください...ドラッグイベントがドロップされた赤いボックスにアタッチされていません...イベントをドロップされたボックスにアタッチしようとしましたが、それでも元の赤いボックスを参照しています

4

2 に答える 2

2

これはあなたが探していた動作でしたか?

「ID」テストを「クラス」に変更し、いくつかの調整を行いました

コードを更新しました

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

于 2013-01-30T06:21:44.783 に答える
0

ドラッグ可能なデータとイベントを使用して、新しく追加された要素を複製しているため、そのように動作していると思います。

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);
}
于 2013-01-29T18:45:25.740 に答える