Question

我有一个droppable div元素，当拖动拖动的元素时，它会淡出。使用out事件可以正常工作。我得到的问题是droppable上有两个可拖动的元素。当我拖一下时，droppable元素仍然会褪色。如何检查droppable上是否还有另一个可拖动元素，以便我可以取消淡入淡出效果。我希望droppable元素仅在最后一个可拖动元素被取消时淡出。

$(".droppable-element").droppable({
    tolerance: 'touch',
    out:function(event,ui){

       /*Need to first check if there is another draggable element in the droppable before fading out.*/
            $(this).fadeOut('slow', function(){
                // Animation complete.

             });                
 }
});

Answer 1

可拖动元素是droppable的子（后代）吗？当它们被拖走时，它们是否被移除？在这种情况下，你可以这样做：

if ( $(this).find(".draggable-element").length == 0 )
    $(this).fadeOut('slow', function(){

更新：如果我理解正确，你将一个元素拖到droppable（可能会删除它？），然后拖动另一个元素，然后删除它。在这种情况下，您可以跟踪哪些（或至少有多少）可拖动器覆盖您的可放置但未放弃。

$(".droppable-element").droppable({
    tolerance: 'touch',
    over:function(event,ui) {
        var howMany = $(this).data("howMany") || 0;
        $(this).data("howMany", howMany+1);
    },
    out:function(event,ui){
        var howMany = $(this).data("howMany") || 1;
        $(this).data("howMany", howMany-1);
        if ( howMany == 1 )
            $(this).fadeOut('slow', function(){
                // Animation complete.
            });
    }
});

检查droppable是否已包含另一个可拖动元素（jQuery UI）

1 个答案: