移動端的常用觸控事件

2021-10-18 10:14:28 字數 845 閱讀 5457

1、touches:表示當前跟蹤的觸控操作的 touch 物件的陣列。

2、 targettouches:特定於事件目標的 touch 物件的陣列。

3、changetouches:表示自上次觸控以來發生了什麼改變的 touch 物件的陣列。 每個 touch 物件包含的屬性

4、clientx:觸控目標在視口中的 x 座標。

5、clienty:觸控目標在視口中的 y 座標。

6、identifier:標識觸控的唯一 id。

7、pagex:觸控目標在頁面中的 x 座標。

8、pagey:觸控目標在頁面中的 y 座標。

9、screenx:觸控目標在螢幕中的 x 座標。

10、screeny:觸控目標在螢幕中的 y 座標。

11、target:觸目的 dom 節點目標。

我們在react中操作的dom事件,獲取到的事件物件,其實是react內部幫我們合成的。為了節約效能,會使用物件池,當乙個合成事件物件被使用完畢,即同步**實現完畢後,會再次呼叫並且將其屬性全部設為null,所以當我們非同步訪問或者列印時,顯示的屬性值已經是null值,解決方法:

按照報錯提示的,加上event.persist()即可,它會將當前的合成事件物件從物件池抽離出來,這樣他就不會再被呼叫並且其屬性不會變為null.

移動端的觸控事件

首先 touch 包含三類事件,它們分別是 touchstart touchmove touchend touch 屬性 1.touch.identifier 此 touch 物件的唯一識別符號。一次觸控動作 我們指的是手指的觸控 在平面上移動的整個過程中,該識別符號不變。可以根據它來判斷跟蹤的是否...

移動端JS 觸控事件基礎

一 手機上的觸控事件 基本事件 touchstart 手指剛接觸螢幕時觸發 touchmove 手指在螢幕上移動時觸發 touchend 手指從螢幕上移開時觸發 下面這個比較少用 touchcancel 觸控過程被系統取消時觸發 每個事件都有以下列表,比如touchend的targettouches...

移動端觸控事件touchmove的坑

一說到移動端觸控事件,大家的反應不就是touchstart,touchmove,touchend嗎,相當於pc段的mousedown,mousemove,mouseup,只要是寫過pc端的js的話,若不慎,往往會坑在移動端。比如說最近我就被touchmove坑了好久好久不能自拔。我的意圖是在觸控的時...