我正在尝试使用触摸和鼠标事件进行非 native 拖放。
我采取的方法是克隆拖动源并移动克隆。所有事件都附在文档中。克隆应用了 pointer-events: none 的 CSS，以允许克隆下的元素算作 mousemove 或 touchmove 的事件目标事件而不是克隆本身。
这在所有桌面浏览器(鼠标)中都很有效，但在使用单点触摸在 ipad 上测试时似乎没有任何效果 - 即克隆始终显示为事件目标。我尝试进行了大量搜索，这让我相信这是可能的，但我没有看到任何结论性的结果。
如果有帮助的话，克隆元素具有以下 CSS:
.mirror {
position: fixed !important;
margin: 0 !important;
z-index: 999999 !important;
opacity: 0.8;
pointer-events: none !important;
}
谢谢!
最佳答案
事实证明，pointer-events: none确实适用于触摸指针，只是方式不同。我永远无法像处理鼠标事件那样可靠地让 event.target 来表示触摸指针下方的元素。
在上面提到的 .mirror 元素上放置 pointer-events: none 确实有效，但我必须将 document.elementFromPoint 与事件坐标来获取底层元素。看起来性能较差且不太优雅，但它的性能没有明显下降。
document.elementFromPoint 的一个问题是，如果您所在的元素位于 iframe 内，您将取回 iframe 元素。然后，您必须获取 iframe 的文档并对其调用 elementFromPoint (考虑 iframe 的左侧和顶部偏移量)。
这一切可能看起来像一团乱麻，但我希望其他人觉得它有帮助。
关于javascript - 拖放 - 使用指针事件触摸元素 : none，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/43159115/