2

我有一个可拖放的 div 元素,当一个可拖动的元素被拖出它时,它会淡出。使用 out 事件可以正常工作。我遇到的问题是当 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.

             });                
 }
});
4

1 回答 1

2

可拖动元素是可放置的子元素(后代)吗?当他们被拖走时,他们是否会被移除?在这种情况下,您可以执行以下操作:

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

更新:如果我理解正确,您将一个元素拖到了可放置对象中(可能是丢弃了它?),然后拖了另一个元素,然后将其删除。在这种情况下,您可以跟踪哪些(或至少有多少)可拖动项超过了您的可放置项但没有消失。

$(".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.
            });
    }
});
于 2012-01-06T01:36:17.583 回答