移动端延迟300ms

（还有很多笔记_{等春招后慢慢再整理吧}）

使用tap解决

• 一次tap事件包含touchstart和touchmove(轻微移动)以及touchend三种状态
• callback方法在touchend后执行
  根据chrome浏览器默认的判断取消点击的移动量，手指偏移量（水平或垂直）超过15px则判定为滚动，取消执行tap事件
• 手指按下时间过长不视为点击，默认时间间隔为500ms
  -使用HTMLElement来扩充原型，方便添加Event
• 使用单例模式，确保只加载一次

fastclick

• 在检测到touchend事件的时候，会通过DOM自定义事件立即出发模拟一个click事件，并把浏览器在300ms之后真正的click事件阻止掉

点击穿透

• 点击穿透现象有3种：点击穿透问题：点击蒙层（mask）上的关闭按钮，蒙层消失后发现触发了按钮下面元素的click事件蒙层的关闭按钮绑定的是touch事件，而按钮下面元素绑定的是click事件，touch事件触发之后，蒙层消失了，300ms后这个点的click事件fire，event的target自然就是按钮下面的元素，因为按钮跟蒙层一起消失了跨页面点击穿透问题：如果按钮下面恰好是一个有href属性的a标签，那么页面就会发生跳转因为a标签跳转默认是click事件触发，所以原理和上面的完全相同

解决

• 不要混用touch和click既然touch之后300ms会触发click，只用touch或者只用click就自然不会存在问题了
• 吃掉（或者说是消费掉）touch之后的click依旧用tap，只是在可能发生点击穿透的情形做额外的处理，拿个东西来挡住、或者tap后延迟350毫秒再隐藏mask、pointer-events、在下面元素的事件处理器里做检测（配合全局flag）等等，能吃掉就行