移动端Touch事件基础

1、三个常用的移动端事件
　　ontouchstart 手指按下时触发
　　ontouchmove 手指移动时触发
　　ontouchend 手动抬起时触发

　　注意：这些事件当作事件属性使用时，不兼容谷歌浏览器。

　　解决方案是，使用 addEventListener()来注册这些移动端事件。

2、pc端事件和移动端事件的区别
　　1）通过 on的方式添加touch事件，在谷歌浏览器下无效。
　　2）pc端的鼠标事件，用在移动端使用时，会产生300毫秒的延迟。

3、移动事件对象 TouchEvent

　　TouchEvent对象，是一个标准事件对象，它默认是事件处理程序的第一个参数。它描述了touch事件发生时的详细信息。

　　获取手指信息：
　　　　touches 当前屏幕上的手指列表
　　　　targetTouches 当前元素上的手指列表
　　　　changedTouches 触发当前事件的手指列表

　　获取手指的个数：

　　　　e.changedTouches.length

　　相关坐标的获取：
　　　　e.pageX / e.pageY 手指触屏时到网页顶部/左侧的距离。
　　　　e.clientX / e.clientY 手指触屏时到窗口上侧/左侧的距离。
　　　　obj.offsetLeft / obj.offsetTop 对象到定位父级的left/top值。

　　获取触屏时坐标：
　　　　e.changedTouches[0].pageX / e.changedTouches[0].pageY

　　三个手指对象的区别：
　　　　在touchend时获取手指列表，只能用 changedTouches。原因是当手指抬起时，touches和targetTouches就没有了，所以只能用changedTouches来获取手指列表。

（未完待续）

巴特西