使用原生JS在移动设备上模拟触控操作(点击、长按、左右方向拖动及上下方向拖动)
发布时间
阅读量:
阅读量
以下是四种touch事件
touchstart: //手指放到屏幕上时触发
touchmove: //手指在屏幕上滑动式触发
touchend: //手指离开屏幕时触发
touchcancel: //系统取消touch事件的时候触发,这个好像比较少用
每当某个触摸事件触发电能时,系统会创建一个event对象,并将其包含的三个触摸列表传递给处理模块。
touches: //当前屏幕上所有手指的列表
targetTouches: //当前dom元素上手指的列表,尽量使用这个代替touches
changedTouches: //在处理当前事件时涉及的手指列表,请尽量使用这个属性来替代 touches
每个触控操作在这些列表中都属于touch对象,并且触控信息被包含在touch对象中。具体来说:
clientX / clientY: //触摸点相对浏览器窗口的位置
pageX / pageY: //触摸点相对于页面的位置
screenX / screenY: //触摸点相对于屏幕的位置
identifier: //touch对象的ID
target: //当前的DOM元素
注意:
手指在滑动整个屏幕时会带来浏览器的行为变化;例如滚动和缩放等操作都是其中之一。因此,在触控事件发生时应避免同时进行缩放操作。
1.禁止缩放
通过me
全部评论 (0)
还没有任何评论哟~
