jQuery：如果没有成功删除助手，如何阻止助手被删除

Posted 2023-05-08

【中文标题】jQuery：如果没有成功删除助手，如何阻止助手被删除

【英文标题】：jQuery: How to stop a helper from being removed if it wasn't successfully dropped

【发布时间】：2010-09-17 13:01:48

【问题描述】：

我有一个 draggable 和一个自定义 helper。有时助手是一个克隆，有时它是原始元素。

问题在于，当帮助器是原始元素并且不放置在有效的可放置对象上时，它会被删除。到目前为止，我的解决方案如下所示：

在我的on_dropped 回调中，我将ui.helper.dropped_on_droppable 设置为true；

在可拖动对象的stop 回调中，我检查了该变量，然后……我该怎么办？

$('.my_draggable').draggable(
    stop   : function(e, ui) 
        if (!ui.helper.dropped_on_droppable) 
            /* what do I do here? */
        
    ,

这是正确的方法吗？

【参考方案1】：

好的，我找到了解决方案！它很丑陋，并且违反了“封装规则”，但至少它完成了工作。

请记住这仅适用于特殊情况！ jQuery 可以很好地处理它自己的帮助器删除。在我的例子中，我有一个助手，它有时是原始元素，有时是克隆，所以在恢复后删除助手并不总是合适的。

element.draggable(
    stop   : function(e, ui) 
        /* "dropped_on_droppable" is custom and set in my custom drop method
           ".moved_draggable" is custom and set in my custom drag method, 
                     to differentiate between the two types of draggables
        */               
        if (!ui.helper.dropped_on_droppable & ui.helper.hasClass('moved_draggable')) 
            /* this is the big hack that breaks encapsulation */
            $.ui.ddmanager.current.cancelHelperRemoval = true;
        
    ,

警告：这会破坏封装并且可能不向前兼容

【参考方案2】：

我可能在这里遗漏了一些东西，但这不仅仅是添加的情况

revert: "invalid"

如果可拖动元素是原始元素而不是克隆元素，则到可拖动元素的选项？

【讨论】：

不，jquery 在恢复后仍然会自动删除助手。至少我终于找到了解决方法....

【参考方案3】：

我使用了一个自定义助手，它将多选可拖动项聚​​合到一个 div 中。这似乎与还原功能不兼容，所以我想出了这个方案。这些元素被手动附加到我通过 .data() 跟踪的原始父级。

.draggable(
    helper: function() 
        var div = $(document.createElement('div'))
            .data('lastParent', $(this).parent());
        return div;
    ,
    start: function() 
        //... add multiple selection items to the helper..          
    ,
    stop: function(event,ui) 
        $( $(ui.helper).data('lastParent') ).append( $(ui.helper).children() );
    

这种方法确实会失去漂亮的动画效果，但它可能对您或遇到此问题的其他人有用。