jQuery abwerfbares Element Überlappung

Question

Ich habe 1 draggable div und 2 droppable divs. Diese 2 Drop-Divs sind ebenfalls verschiebbar, so dass sich diese 2 Divs möglicherweise überschneiden. In dieser Situation, wenn ich ziehen Sie die draggable div und Drop auf die überlappenden divs, gibt es irgendwie um sicherzustellen, dass es auf die obere fallen gelassen wird?

Answer 1

Ich hatte ein etwas anderes Problem: Ich hatte zwei Arten von Dropables, wobei eine Art immer über der anderen lag.

Um zu wissen, auf welchem Droppable das Draggable abgelegt wurde, fügte das höhere Droppable dem Draggable eine Klasse hinzu, wenn es darüber gezogen wurde. Wenn das Drop-Ereignis auf beiden Dropables ausgelöst wurde, überprüfte das untere Dropable, ob das Draggable die hinzugefügte Klasse hatte. Wenn ja, wurde das Drop-Ereignis ignoriert.

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
        }
    }
});