基本概念
1、在移动web端点击事件或者滑动屏幕、捏合等动作都是由touchstar、touchmove、touchend这三个事件组合在一起使用的
2、click事件在移动端会有0.2秒的延迟,下面是测试click在移动web端的延迟,最好在手机浏览器中测试
3、touchstar、touchmove、touchend这三个事件我们关注的是里面的touches属性,这是一个数组,里面有鼠标clientX与clinetY属性
Title
touchstart:touches中有长度为1的数组,touches[0]中clientX,clientY是有值的
touchmove:touches中有长度为1的数组,touches[0]中clientX,clientY是有值的,而且不断在变化
touchend:touches中有长度为0的数组,因为我们只是一个鼠标在点击,鼠标弹起的时候touches是不会存储值的
点击事件
既然click有延迟,那么我们就用touch的三个事件来代替click事件,只要满足下面几种情况,我们就能够说明这次动作是点击事件,而不是长按屏幕或者滑动屏幕
1、touchstart与touchend触发的事件大于250就证明这不是点击事件
2、touchmove事件在这次动作中被触发就证明这不是点击事件
3、下面是封装的一个toush事件模仿点击事件,需要注意的是回调函数的参数,它的实参是在函数中被传入的
Title