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元素），並將其放入另一箇中的另一個table。刪除後，我希望能夠拖動該元素到另一個td在相同的table（如拖拽班級時間表圍繞一個時間表）

我已設法「重新拖動」該刪除的元素，而不是「移動」到不同的td，我似乎能夠做的就是不斷克隆我拖動的元素。我怎樣才能確保當我「重新拖動」我最初丟棄的元素時，它會從最初被刪除的td中刪除，然後「移動」到後續的td？

Answer 1

如果要保持「可拖動性」，則可以將ui.draggable附加到新的td。這樣，你仍然可以拖動物品被丟棄，讓你可以免費統治每個物品的位置。

我簡化了你的例子，特別是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

如果您有任何疑問，請詢問。