1. 程式人生 > >touch事件中的touches、targetTouches和changedTouches詳解

touch事件中的touches、targetTouches和changedTouches詳解

move htm nal 手指 tde hang 參數 eve function

touches:當前屏幕上所有觸摸點的列表;

targetTouches:當前對象上所有觸摸點的列表;

changedTouches:涉及當前(引發)事件的觸摸點的列表:

可通過一個例子來區分觸摸事件中的這三個屬性:

1、用一個手指接觸屏幕觸發事件,此時這三個屬性有相同的值。

2、用第二個手指接觸屏幕時,此時,touches有兩個元素,每個手指觸摸點為一個值。當兩個手指觸摸相同元素時,targetTouches和touches的值相同,否則changedTouches此時只有一個值,為第二個手指的觸摸點,因為第二個手指是引發事件的原因。

3、用兩個手指同時接觸屏幕,此時changedTouches有兩個值,每一個手指的觸摸點都有一個值

4、手指滑動,三個值都會發生變化

5、一個手指離開屏幕,touches和targetTouches中對應的元素會同時移除,而changedTouches仍然會存在元素

6、手指都離開屏幕後,touches和targetTouches中將不會再有值,changedTouches還會有一個值,此值為最後一個離開屏幕的手指的接觸點

二、觸點坐標獲取

touchstart和touchmove使用:e.targetTouches[0].pageX或(jquery)e.originalEvent.targetTouches[0].pageX

touchend使用:e.targetTouches[0].pageX或(jquery)e.originalEvent.changedTouches[0].pageX

三、touchmove事件的獲取

想要在touchmove:function(e,參數一){

  var e=arguments[0];

  e.preventDefault();

}

出處:http://blog.sina.com.cn/s/blog_468530a60102wzkw.html

touch事件中的touches、targetTouches和changedTouches詳解