移動端touch事件影響介面click/超連結事件無法點擊

標籤：半徑   pre   art   event   數值   包括   滑動   列表   end   

觸摸事件:

三種在規範中列出並獲得跨行動裝置廣泛實現的基本觸摸事件：

1.touchstart：手指放在一個DOM元素上。

2.touchmove：手指拖曳一個DOM元素。

3.touchend：手指從一個DOM元素上移開。

每個觸摸事件都包括了三個觸摸列表：

1.touches：當前位於螢幕上的所有手指的一個列表。

2.targetTouches：位於當前DOM元素上的手指的一個列表。

3.changedTouches：涉及當前事件的手指的一個列表。

例如，在一個touchend事件中，這就會是移開的手指。

這些列表由包含了觸摸資訊的對象組成：

1.identifier：一個數值，唯一標識觸摸會話（touchsession）中的當前手指。

2.target：DOM元素，是動作所針對的目標。

3.客戶/頁面/螢幕座標：動作在螢幕上發生的位置。

4.半徑座標和rotationAngle：畫出大約相當於手指形狀的橢圓形。

 

這兩天自己在做一個移動端APP，要用到滑動觸發動畫的效果，做完之後發現滑動和動畫可以順利完成，但是頁面其他的超連結和click點擊事件卻無法點擊了，用到的庫是zepto和vue。

之後排查發現問題可能是出在event事件中，就把touchstart和touchend事件的預設行為取消了(e.preventDefault()),取消後發現可以點擊了，但是滑動效果大打折扣了，從右邊滑動回左邊的時候效果非常差，然後就上百度查，發現有一篇文章

https://www.cnblogs.com/lvmingyin/p/5372678.html

之後把阻止預設行為添加到touchmove 就OK了。

相關的文章地址: http://caibaojian.com/mobile-touch-event.html

移動端touch事件影響介面click/超連結事件無法點擊