移动端，click 点击事件延时与穿透

问题

1. 监听元素 click 事件，点击元素触发时间延迟约 300ms。
2. 点击蒙层，蒙层消失后，下层元素点击触发。

原因

为什么会产生 click 延时？

iOS 中的 safari，为了实现双击缩放操作，在单击 300ms 之后，如果未进行第二次点击，则执行 click 单击操作。也就是说来判断用户行为是否为双击产生的。但是，在 App 中，无论是否需要双击缩放这种行为，click 单击都会产生 300ms 延迟

为什么会产生 click 点击穿透？

双层元素叠加时，在上层元素上绑定 touch 事件，下层元素绑定 click 事件。由于 click 发生在 touch 之后，点击上层元素，元素消失，下层元素会触发 click 事件，由此产生了点击穿透的效果

解决方法

• touchstart 替换 click
  事件触发顺序: touchstart, touchmove, touchend, click
  很容易想象，在我需要touchmove滑动时候，优先触发了touchstart的点击事件，是不是已经产生了冲突呢？
  所以呢，在具有滚动的情况下，还是建议使用 click 处理。
• 使用 fastclick 库
  使用 npm/yarn 安装后使用
  import FastClick from ‘fastclick’;
  FastClick.attach(document.body, options);
  同样，使用fastclick库后，click 延时和穿透问题都没了