禁用droppable后启用droppable

Question

作为this SO question，我遇到了一个模拟问题。我有一个带有overflow: scroll的div，里面有droppables。如果可拖放对象落在div下方，则仍会触发可拖放对象。这个问题的解决方案确实防止了这种情况的发生。然而，我有另一个div，在我的第一个div下面有droppables。这个解决方案也可以防止我掉到我的第二个droppable上。

所以我不得不对它进行一些修改，而不是检查drop事件，而是将它放在droppable上的over事件上。如果droppable是隐藏的，我就禁用它。这使得第二个droppable可以工作，但我在重新启用droppable以供将来使用时遇到了麻烦。我试过使用droppable的事件，但我猜当我禁用droppable时，它也会被禁用，因为它不会触发。droppable被禁用后如何启用？或者有更好的方法来做这件事？

$('.droppable').droppable({            
         over: function(event, ui) {
            var myOverflowObj = $(this).closest(".module, #process-window");

            if (myOverflowObj.length) {

                var cTop = myOverflowObj.position().top + parseInt(myOverflowObj.css("margin-top"));
                var cBtm = myOverflowObj.position().top + parseInt(myOverflowObj.css("margin-top")) + myOverflowObj.height();
                var dTop = $(this).position().top + parseInt($(this).css("margin-top"));
                var dBtm = $(this).position().top + parseInt($(this).css("margin-top")) + $(this).height();

                if ((dBtm > cTop && dTop < cBtm) == false) {
                    $(this).droppable("option", "disabled", true);
                }
            }
        },
        out: function(event, ui) {
            $(this).droppable("option", "disabled", false);           
        }
});

Answer 1

我设法做了一个变通的工作，使用draggable对象的stop事件来重新启用那些已被禁用的droppables。

$('.draggable').draggable({     
    stop: function() { 
        $.each($('.droppable.ui-state-disabled'), function(index, value) { 
            $(this).droppable("option", "disabled", false);       
        });
   }          
});