移动开发:触摸事件

当用户手指放在屏幕上面时,在屏幕上滑动时或从屏幕上移开时会触发一些相关事件,这类事件称之为触摸事件,有以下几个:

1 touchstart //当手指触摸屏幕时触发,即使已经有一个手指放在了屏幕上也会触发
2 touchmove //当手指在屏幕上滑动时连续的触发
3 touchend //当手指从屏幕上移开时触发
4 touchcancel //当系统停止跟踪触发是触发,关于此类事件的确切触发时间,文档中没有明确说明

上面这几个事件都会冒泡,也都可以取消,每个触摸事件的event对象都提供了在鼠标事件中常见的属性:bubbles,cancelable,view,clientX,clientY,screenX,screenY,detail,altKey,ctrlKey,shiftKey,metaKey
除了常见的DOM属性外,触摸时间还包含下列3个用于跟踪触摸属性:

1 touches // 表示当前跟踪的触摸操作的Touch对象的数组
2 targetTouches // 特定与事件目标的Touch对象的数组
3 changeTouches // 表示自上次触摸以来发生了什么改变的Touch对象的数组

每个触摸对象包含下列属性:

1 clientX // 触摸目标在视口中的X坐标
2 clientY // ~Y坐标
3 identifier // 标识触摸唯一ID
4 pageX // 触摸目标在页面中的X坐标
5 pageY //~Y坐标
6 screenX //触摸目标在屏幕中的X坐标
7 screenY // ~Y坐标
8 target //触摸的DOM节点目标

关于触摸目标可以看看这个http://classjs.com/demo/phone/03/touchdetail.html,对了别忘了在手机端的webkit核心的浏览器里查看。


你可能感兴趣的:(移动开发:触摸事件)