HTML5触摸事件演化tap事件介绍

2020-04-24 19:38:48易采站长站整理
 screenY 相同. 只读属性.
Touch.target

当这个触点最开始被跟踪时(在 

touchstart
 事件中), 触点位于的HTML元素. 哪怕在触点移动过程中, 触点的位置已经离开了这个元素的有效交互区域,

或者这个元素已经被从文档中移除. 需要注意的是, 如果这个元素在触摸过程中被移除, 这个事件仍然会指向它, 但是不会再冒泡这个事件到 

window
 或 
document
 对象.

因此, 如果有元素在触摸过程中可能被移除, 最佳实践是将触摸事件的监听器绑定到这个元素本身, 防止元素被移除后, 无法再从它的上一级元素上侦测到从该元素冒泡的事件. 只读属性.

 

IE10+的触摸事件

IE指针事件
事件名称描述(在触摸设备上)
MSPointerDown触摸开始
MSPointerMove接触点移动
MSPointerUp触摸结束
MSPointerOver触摸点移动到元素内,相当于mouseover
MSPointerOut触摸点离开元素,相当于mouseout

 

MSPointerEvent属性

属性描述
hwTimestamp创建事件的时间(ms)
isPrimary标识该指针是不是主指针
pointerId指针的唯一ID(类似于触摸事件的标识符)
pointerType一个整数,标识了该事件来自鼠标、手写笔还是手指
pressure笔的压力,0-255,只有手写笔输入时才可用
rotation0-359的整数,光标的旋转度(如果支持的话)
tiltX/tiltY手写笔的倾斜度,只有用手写笔输入时才支持

 

等价事件

鼠标触摸键盘
mousedowntouchstartkeydown
mousemovetouchmovekeydown
mouseuptouchendkeyup
mouseover focus

 

很显然,触摸动作序列:touchstart-touchmove-touchend和鼠标序 列:mousedown-mousemove-mouseup以及键盘序列:keydown-keypress-keyup很相似,这并不是巧合,因为这 三种交互模式都可以描述为start-move-stop。

话说回来,click要经过touchstart-touchmove-touchend流程,300ms延迟,所以需要tap事件,tap就是在同一个点轻触时间很短。