触摸浏览器中的元素（如指针 - 事件：无）

Question

问题：

我进行了搜索和搜索，但是找不到有关如何通过叠加元素触发触摸事件的信息。我已使用以下方法解决了鼠标点击事件的问题：

pointer-events: none;

这很简单，但它不适用于触摸事件。我知道有一些移动原生内容可以解决这个问题，但这纯粹适用于浏览器 - 包括移动和非移动浏览器。

项目：

这是我的基本项目Croppy。我有一些基本的触摸变焦和良好的拖动，但它受到我的作物div在画布上的阻碍（不幸的是，这在视觉上是必要的）。如果你想直接修补它，还有一个例子。我试图在没有任何外部库作为练习的情况下完成所有操作。

非常感谢任何帮助或指示！

Answer 1

也许这应该是显而易见的，但我找到了答案。 仅执行pointer-events: none 工作，但很少，我必须快速移动手指以使其触发正确。为了让它100％工作，我在overlay元素中添加了一个touchstart事件监听器，如下所示：

overlay.addEventListener('touchstart', function(e){
  e.preventDefault();
});

这看起来有点傻，但也许这与CSS和JavaScript如何踩到彼此的脚趾有关。我不知道。

有趣的是，没有e.preventDefault()，它仍然有效，但不是100％的时间。我不确定此操作是否严格要求该行才能正常工作。

编辑：顺便说一句，这是Android Chrome 31.0.1650.59。