javascript - 如何防止子元素干扰 HTML5 dragover 和 drop 事件？

Question

我有一个 <div>我已将“drop”和“dragover”事件附加到的 drop 目标。 <div>在 anchor 标记内包含图像(简单地说:<div><a><img /></a></div>)。目标的子元素似乎阻止触发“drop”或“dragover”事件。仅当拖动的元素位于目标上方但未位于其子元素上方时，才会按预期触发这两个事件。

我想要实现的行为是在目标上方的任何位置触发“dragover”和“drop”事件 <div> , 无论子元素是否存在。

Answer 1

您可以在 CSS 中为所有 child 禁用指针事件。

.targetDiv * {
    pointer-events: none;
}