移动端三大事件:
1.ontouchstart 手指按下
2.ontouchmove 手指移动
3.ontouchend 手指抬起
在使用浏览器调试的时候,容易出现事件丢失,但是在真机上运行是好的,所以建议使用事件绑定 xxx.addEventListener('touchstart',()=>{ })
pc 事件(比如:click)延迟是在 300毫秒左右*
手机端为了能够判断用户是否双击缩放,刻意通过监控用户是否在300ms之内连续点击屏幕2次,所以 click 有300ms延迟
移动端事件 按下 和 移动 和 抬起 是一套的,在按下的时候此时焦点就为按下的元素,抬起的时候自动触发(按下时的)元素。
所以移动端不需要嵌套事件使用。
事件点透:
一个元素下有个焦点元素(比如:a、input ...),在300ms之内让上层元素消失或者漂移,这个时候手机会记录下按下的位置并且进行监听(是否触发了两次),
因为要监听是否双击,所以它在第一次按下的时候记录(捕捉)到了坐标,如果正好这个坐标下有焦点元素,此时就会触发焦点元素。
解决:
1.在上层元素消失的时候延迟执行(用户体验不好、兼容性不太好)
2.不使用焦点元素(对SEO搜索引擎不太好)
3.在全局阻止 touchend 默认行为,