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

Posted 2023-05-08

【中文标题】删除拖放时可拖动的助手克隆

【英文标题】：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');
  
)

【参考方案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