jQuery可放置项目重叠

Question

我有 1 个可拖动的 div 和 2 个可放置的 div。这 2 个可放置的 div 也是可拖动的，因此这 2 个 div 可能会重叠。在那种情况下，当我将可拖动的 div 拖放到重叠的 div 时，是否有办法确保它被拖放到顶部？

Answer 1

我有一个稍微不同的问题：我有两种类型的 droppable，一种总是在另一种之上。

要知道draggable 被拖放到哪个droppable 上，当它被拖到它上面时，更高的droppable 将一个类添加到draggable 上。当两个 droppable 上的 drop 事件触发时，较低的 droppable 检查可拖动对象是否具有添加的类。如果是，则忽略 drop 事件。

top.droppable({
    over: function( drop_event, drop_ui ) {
      drop_ui.helper.addClass('over_top_element');
    },
    out: function( drop_event, drop_ui ) {
      drop_ui.helper.removeClass('over_top_element');
    },
    drop: function(drop_event, drop_ui) {
      //Handle drop here
    }
});

bottom.droppable({
    drop: function(drop_event, drop_ui) {
        if (!ui.helper.hasClass('over_top_element'))
        {
            //Handle drop here
        }
    }
});