jquery：クローン化せずにドロップした後に要素をドラッグ可能にする

Question

$(".drag").draggable({ 
    start: function() { 
    $(this).height(150).width(195); 
    }, 
    cursor: "move", 
    revert: "invalid", 
    appendTo: "body", 
    containment: "document", 
    helper: "clone", 
    distance: 50 
}); 

$(".drop").droppable({ 
     hoverClass: "hoverDrop", 
     tolerance: "pointer", 
     drop: function(event, ui) { 
      var elem = $(ui.draggable).clone(); 
      $(this).append(elem); 
      $(this).droppable('disable'); //disbles more than one draggable from being dropped 
      // console.log(this); 
      $(elem).draggable({ 
      helper: "clone", 
      drag: function(event, ui) { 
       $(elem).prev().empty(); 
      } 
      }); 
     } //end of drop function 

こんにちは！ドラッグ＆ドロップをして、アクティビティ（td要素）をドラッグしてtdに別のtableという名前でドロップできます。それを落とした後、その要素を別のtdに同じtableにドラッグできるようにしたい（タイムテーブルの周りのクラススケジュールをドラッグするのと同じように）

私はドロップされた要素を "再ドラッグ"することができましたそれを別のtdに「移動」すると、私はドラッグできる要素を複製し続けることしかできないようです。私が最初に落とした要素を「再ドラッグ」すると、それは最初のtdから削除され、最初に削除され、次のtdに「移動」されたことを確認できますか？

Answer 1

「ドラッグ可能性」を維持する場合は、新しいtdにui.draggableを追加できます。そうすれば、アイテムをドラッグすることができるようになり、各アイテムの場所を自由に治めることができます。

私はいくつかの具体例、具体的にはdropイベントを簡略化しました。また、簡略化と障害発生箇所が少なくなるように、optionsの一部を削除しました。あなたは、あなたのプロジェクトにoptionsを再度追加することができます

$('.drag').draggable({ 
    cursor: "move", 
    revert: true, 
    appendTo: "body", 
    containment: "document", 
    distance: 50 
}); 

$('.drop').droppable({ 
    hoverClass: "hoverDrop", 
    tolerance: "pointer", 
    drop: function(event, ui) { 
    $(this).find('ul').append(ui.draggable); 
    } 
}); 

Fiddle Demo

ご質問がありましたら、お問い合わせください。