自定义拖放 HTML5

Question

我正在尝试使用拖放来重新排列列表中的元素（纯 javascript）。我想在拖动操作期间对 "ghost element" 进行样式化。因为我读到没有办法标准地做到这一点，所以我创建了重复元素（按我想要的样式）定位在拖动操作期间原始元素应该在的位置，并且它的位置在 ondrag 事件中更新。

问题在于，由于此重复元素始终恰好位于光标下，因此无法捕获其他元素上的 dragover 或 dragenter 事件。无论 DOM 中的哪个位置是 "duplicate" 元素链接它总是阻止 ondragover。如果我移动重复元素使其不在光标下，它可以工作，但这违背了无缝重复元素的目的。

有没有什么方法可以忽略这个重复的元素，让位于它下面的元素获得 ondragover 事件？通常事件只是冒泡到链接重复元素的父级。

Answer 1

成功了。如果它的 class 有 :

，它似乎可以工作（幽灵元素没有阻止事件）

.duplicateGhostElementClass {
  pointer-events: none;
}

也许它可以节省一些人的时间。