HTML5移动端触摸事件

一、移动端事件问题 1.click事件300ms延迟问题

2007年第一代iphone发布,移动端Safari首创双击缩放功能,原理是click一次后,经过300ms之后检测是否再有一次click,如果有就会缩放,如果没有则是一个click事件。所以cilck操作会有卡顿感觉。

2.dblclick事件失效

由于双击缩放的存在,移动端的dblclick事件也失效了。

二、移动端触摸事件

touchstart  在屏幕上按下手指时触发

touchmove     在屏幕上移动手指时触发

touchend        在屏幕上抬起手指时触发

touchcancel    触点由于某些原因被中断时触发。例如触摸时电话接入或者弹出框,都会中断触摸。一般会在这时暂停游戏、存档等操作。

三、TouchEvent事件对象

TouchEvent继承了UIEvent和Event,事件对象中包含很多内容,这里挑一些常用的:

touches 位于当前屏幕上所有触摸点列表(TouchList对象,包含若干个Touch对象) targetTouches 起始于当前DOM元素,且没有结束的触摸点列表,是touches的一个严格子集(TouchList对象) changedTouches 当前事件发生变化的触摸点列表(TouchList对象).对于touchstart,新增加的触点;对于touchmove,和上一次事件比较发生变化的触点(任何一个属性);对于touchend,离开屏幕的触点。 target 触发事件的DOM节点 type 当前事件的类型,如"touchstart" altKey 布尔值,指明触摸事件触发时,键盘 alt 键是否被按下。 ctrlKey 布尔值,指明触摸事件触发时,键盘 ctrl 键是否被按下。

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wpjwsx.html