手动触发释放按下/触摸的元素

Question

问题的本质是释放一个元素上的触摸作为在触摸和按住期间显示的覆盖元素上的点击事件。

我怎样才能防止这种情况发生？

<https://jsfiddle.net/24r1s6nf/1/>

我在 jsfiddle 中重新创建了这个问题。该问题仅发生在移动浏览器中。点击完成后，覆盖脚本会意外触发。

我有一个脚本，可以在按下/触摸元素超过 1 秒时在网页上显示模式，并显示叠加层。叠加层具有单击时隐藏模式的功能。

工作流程如下：

1. 在 z-index 1 上按住元素 h1 1 秒
2. 在 z-index 3 上显示模态
3. 在 z-index 2 上显示叠加层

问题是当我在移动chrome IOS中释放触摸时，覆盖也已经显示在触摸位置下。因此，当我释放触摸以显示模态时，在覆盖层和隐藏模态脚本上会自动触发单击事件，这不是我打算做的。

有没有办法在元素上强制释放真正的 touchend 事件，以便我可以在覆盖开始之前调用。 我尝试了以下不起作用。

var myevent = new Event("mouseup"); myelement.dispatchEvent(myevent);

或 var myevent = new Event("touchend"); myelement.dispatchEvent(myevent);

Answer 1

event.stopPropagation() 不起作用。 我通过在 touchend 中添加 event.preventDefault() 来解决它。