目有个交互需要实现手指滑动的交互,pc端使用mousedown,mousemove,mouseup监听实现。
但在ios设备上mousemove是不好监听的,同类的方法是touchstart,touchmove,touchend。
项目需求,需要用到拖动事件。由于不需要考虑IE8等低端浏览器的兼容性, 所以想到HTML5中的drag
事件, 发现移动端 android & IOS
并不支持 drag
事件。现在让我们来介绍一下移动端的常用事件吧
一、click点击事件
二、touch触摸事件
2.1事件列表
changedTouches:保存了所有引发事件的手指信息
targetTouches:保存了当前对象上所有触摸点的列表;
touches:保存了当前所有触碰屏幕的手指信息
2.1.1事件属性(只读属性)
移动端触摸事件属性里的数组元素的属性:每个事件有列表,每个事件列表还有以下属性
pageX //相对于页面的 X 坐标,与 clientX 不同的是,他包括左边滚动的距离,如果有的话。
三、tap类触碰事件
四、swipe滑动事件
五、gesture手势事件
- gesturestart:当一个手指已经按在屏幕上面另一个手指有触摸屏幕时触发。
- gesturechange:当触摸屏幕的任何一个手指的位置发生变化时触发。
- gestureend:当任何一个手指从屏幕上面移开时触发。
当有新手指触控到绑定的元素,会触发一次事件。
来源:博客园
作者:给时光以生命
链接:https://www.cnblogs.com/jing-tian/p/11049705.html