删除拖放时可拖动的助手克隆答案

【问题标题】：Remove draggable's helper clone on drop删除拖放时可拖动的助手克隆
【发布时间】：2014-01-23 09:26:24
【问题描述】：

我有一个带有 revert: true 的可拖动元素，但是当它成功删除时，助手克隆仍保留在我放手的可放置元素上。我需要克隆在成功放置时消失，就像在不成功放置时一样。

$('.frank').draggable({ 
  revert: true,
  revertDuration: 0,
  helper: 'clone'
})

$( ".offer-2" ).droppable({
  accept: '.frank',
  drop: function() {
    $(this).addClass('offer-2b');
    $('.frank, .tp-2').draggable('disable');
  }
})

【问题讨论】：

标签： jquery clone draggable

【解决方案1】：

你可以在你的 drop 函数中删除助手

$( ".offer-2" ).droppable({
    accept: '.frank',
    drop: handleDropEvent
});

function handleDropEvent( event, ui ) {
    $(this).addClass('offer-2b');
    $('.frank, .tp-2').draggable('disable');
    $(ui.helper).remove();
};

【讨论】：

【解决方案2】：

在 drop 事件上隐藏助手：

$( ".offer-2" ).droppable({
  accept: '.frank',
  drop: function(event, ui) {
    $(this).addClass('offer-2b');
    ui.helper.hide();
  }
})

或者如果你真的不需要丢弃的元素，那么ui.helper.remove()

jQuery Droppable drop event

【讨论】：