javascript - jQuery 拖放 - 检查可放置外的放置

Question

很抱歉，如果这个问题在另一个问题中得到了回答，我找不到针对我的问题的特定答案!

我正在尝试测试 jQuery 可拖动对象是否被放置在合法可放置对象之外。这通常会在 90% 的情况下通过恢复可拖动来解决，但我不想那样做。相反，如果 draggable 被放到一个 droppable 上，我想做一件事(工作得很好!)，如果它被放到所有可能的 droppable 之外，我想做另一件事(目前让我变得更好!)。

简而言之:

jQuery('#droppable').droppable(
{
    accept: '#draggable',
    drop: function(event, ui)
    {
        // awesome code that works and handles successful drops...
    }
});

jQuery('#draggable').draggable(
{
    revert: false,
    stop: function()
    {
        // need some way to check to see if this draggable has been dropped
        // successfully or not on an appropriate droppable...
        // I wish I could comment out my headache here like this too...
    }
});

我觉得我错过了一些非常明显的东西......在此先感谢您的帮助!

Answer 1

因为 droppable 的 drop 事件在 draggable 的停止事件之前触发，我认为你可以在 drop 事件中为被拖动的元素设置一个标志，如下所示:

jQuery('#droppable').droppable(
{
    accept: '#draggable',
    drop: function(event, ui)
    {
        ui.helper.data('dropped', true);
        // awesome code that works and handles successful drops...
    }
});

jQuery('#draggable').draggable(
{
    revert: false,
    start: function(event, ui) {
        ui.helper.data('dropped', false);
    },
    stop: function(event, ui)
    {
        alert('stop: dropped=' + ui.helper.data('dropped'));
        // Check value of ui.helper.data('dropped') and handle accordingly...
    }
});