JQuery Вложенные Droppables

Question

У меня есть вложенный набор JQuery Droppables ... один внешний Droppable, который охватывает большую часть страницы и набор вложенных внутренних Droppables на странице.Мне нужна следующая функция:

• Если перетаскиваемый предмет опущен за пределы какой-либо из внутренних капель, он должен быть принят внешней каплей.

• Если перетаскиваемый объект перетаскивается на какую-либо из внутренних опускаемых предметов, он НЕ ДОЛЖЕН приниматься внешним сбрасываемым предметом, независимо от того, принимает ли перетаскиваемый объект перетаскиваемый объект.Я мог бы гарантировать, что 1+ внутренние объекты droppables примут перетаскиваемый объект, потому что атрибут жадности обеспечит его запуск только один раз.К сожалению, большую часть времени внутренняя команда сброса также отклоняет перетаскиваемый объект, а это означает, что жадный параметр не очень помогает.но когда вы выбрасываете перетаскиваемое за пределы любого из перетаскиваемых предметов, оно разрушается внешним сбрасываемым предметом.

  Какой лучший способ сделать это?

Answer 1

Чтобы сделать это, вы не можете использовать встроенную опцию accept, потому что она не вызовет событие drop для текущего сбрасываемого объекта, если перетаскиваемый объект не является приемником, и, следовательно, будет распространяться в родительский объект. Droppable.

Таким образом, лучший способ - реализовать собственную проверку приема, которая довольно проста:

$('#foo').droppable({
    drop: function(e){
        console.log(e);
    }
});

var accepted = '#red';
$('#bar').droppable({
    greedy: true,
    drop: function(e,ui){
        if (!$(ui.draggable).is(accepted)) {
            return false;
        }
        console.log(e.target);
    }
});

Вы можете увидеть, как это работает на jsFiddle .