禁用后启用可放置答案

【问题标题】：Enable a droppable after it has being disable禁用后启用可放置
【发布时间】：2012-02-14 13:58:59
【问题描述】：

我有一个类似this SO question 的问题。我有一个带有overflow: scroll 的div，里面有droppables。如果一个可拖动的对象低于 div，则该可拖放对象仍会触发。该问题的解决方案确实可以防止这种情况发生。但是，我在第一个 div 下方有另一个 div 和 droppables。该解决方案也阻止了我放弃我的第二个 droppable。

所以我不得不稍微修改一下，而不是检查 drop 事件，而是将它放在 droppable 上的 over 事件上。如果 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);           
        }
});

【问题讨论】：

标签： jquery

【解决方案1】：

我设法解决了问题，使用可拖动对象的停止事件来重新启用那些已禁用的可放置对象。

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

【讨论】：