HTML拖放和事件冒泡的潛在錯誤

Question

我注意到，當div中有一個正在處理dragenter / leave事件的div時，在內部div上拖動會導致外部div觸發dragleave 。 但這僅在外部div position: fixed 。 否則，將子div /內部div拖動到其父級會正確冒泡。

示例： https ： //jsfiddle.net/ffxsam/L2mvbo2t/

將文件拖到輸出窗格上，您將看到放置區。 如果繼續拖動“ Uh oh”文本，則放置區消失。 注釋掉該position: fixed線，然后重試，您將看到是否將鼠標拖到“呃哦”上，但仍保留了dropzone。

這是錯誤嗎？ 實際上，我只是意識到在Firefox中，當我在內部div上移動時，無論position為何， dragleave都會被觸發。 我該如何解決？

Answer 1

我通過三層解決了這個問題：

全角position: fixed背景div，其中包含兩個div：

• 帶有z-index: 1一個div z-index: 1顯示諸如“放到此處上傳”之類的文本。
• 另一個具有z-index: 2 div是全角/全角position: absolute ，位於上一個div的頂部，以查看拖動事件。