解决移动端touchstart事件穿透问题方案
- 巴扎黑原创
- 2017-07-20 15:26:402270浏览
【来源】：在开发移动端网站时，会经常徘徊在click和touchstart之间；因为touchstart虽然好用和快速响应；但是其缺点也是显而易见的，当我们大面积的使用touchstart的时候就会遇到，滚动页面的时候会频繁的触发，导致其不友好的体验；所以，不能单独的说哪个好与不好，而应该利用其长处，规避其缺点；
而且，对于a标签，在移动端的跳转方式，等同于click（经过自己实际体验）
【问题】在我们在上层触发touchstart的时候，下层的click或者a标签都会同时被触发（严格的讲是350ms之后触发）
【原理】是由于click的触发时间是500ms，而touchstart触发时间是350ms，由于500>350导致的用户出现了穿透问题
【解决办法】解决问题的办法有多重多样，换个角度换个方式，就有不同的答案；下面介绍几个我在实际中行之有效的方法，仅供参考：
可以把touchstart换成touchend，因为触发touchend需要200ms所以可以把触发时间这个原理问题解决掉（这个也是我经常使用的，处理点击问题）
大家也可以在触发下面一层覆盖上一层透明层，让其穿透到这个透明层，而不是有事件的那层（这种方法增加了层级，也增加的编码的复杂度）
以上是解决移动端touchstart事件穿透问题方案的详细内容。更多信息请关注PHP中文网其他相关文章！
声明：
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn