PointerEvent

Baseline 廣泛可用 *

此特性已經十分成熟,可在許多裝置和瀏覽器版本上使用。自 2020 年 7 月以來,它已在各大瀏覽器中可用。

* 此特性的某些部分可能存在不同級別的支援。

PointerEvent 介面代表由指標生成的 DOM 事件的狀態,例如接觸點的幾何形狀、生成事件的裝置型別、施加在接觸表面上的壓力等。

指標 是輸入裝置(如滑鼠、筆或觸控式螢幕上的接觸點)的硬體無關表示。指標可以指向接觸表面上的特定座標(或一組座標),例如螢幕。

指標的命中測試 是瀏覽器用來確定指標事件目標元素的過程。通常,這是透過考慮指標的位置以及螢幕媒體上文件中元素的視覺佈局來確定的。

Event UIEvent MouseEvent PointerEvent

建構函式

PointerEvent()

建立一個合成的、不可信的 PointerEvent

例項屬性

此介面繼承自 MouseEventEvent 的屬性。

PointerEvent.altitudeAngle 只讀

表示感測器(指標或手寫筆)軸與裝置螢幕的 X-Y 平面之間的角度。

PointerEvent.azimuthAngle 只讀

表示 Y-Z 平面與包含感測器(指標或手寫筆)軸和 Y 軸的平面之間的角度。

PointerEvent.persistentDeviceId 只讀

生成 PointerEvent 的指向裝置的唯一識別符號。

PointerEvent.pointerId 只讀

導致事件的指標的唯一識別符號。

PointerEvent.width 只讀

指標接觸幾何的寬度(X 軸上的大小),以 CSS 畫素為單位。

PointerEvent.height 只讀

指標接觸幾何的高度(Y 軸上的大小),單位為 CSS 畫素。

PointerEvent.pressure 只讀

指標輸入在 01 範圍內的歸一化壓力,其中 01 分別表示硬體能夠檢測到的最小和最大壓力。

PointerEvent.tangentialPressure 只讀

指標輸入(也稱為筒壓或圓柱應力)在 -11 範圍內的歸一化切向壓力,其中 0 是控制的中間位置。

PointerEvent.tiltX 只讀

Y-Z 平面與包含指標(例如筆手寫筆)軸和 Y 軸的平面之間的平面角(以度為單位,範圍為 -9090)。

PointerEvent.tiltY 只讀

X–Z 平面與包含指標(例如,筆尖)軸和 X 軸的平面之間的平面角度(以度為單位,範圍為 -9090)。

PointerEvent.twist 只讀

指標(例如筆手寫筆)圍繞其主軸的順時針旋轉角度,以度為單位,值為 0359

PointerEvent.pointerType 只讀

指示導致事件的裝置型別(滑鼠、筆、觸控等)。

PointerEvent.isPrimary 只讀

指示此指標是否表示此指標型別的主要指標。

例項方法

PointerEvent.getCoalescedEvents() 安全上下文

返回合併到已分派的 pointermove 事件中的所有 PointerEvent 例項的序列。

PointerEvent.getPredictedEvents()

返回瀏覽器預測將跟隨已分派的 pointermove 事件的合併事件的 PointerEvent 例項序列。

Pointer 事件型別

PointerEvent 介面有幾種事件型別。要確定哪個事件已觸發,請檢視事件的 type 屬性。

注意: 重要的是要注意,在許多情況下,會同時傳送指標事件和滑鼠事件(以允許非指標特定程式碼仍然與使用者進行互動)。如果您使用指標事件,則應呼叫 preventDefault() 以避免也傳送滑鼠事件。

pointerover

當指向裝置移入元素的命中測試邊界時,會觸發此事件。

pointerenter

當指向裝置移入元素或其任何子元素的命中測試邊界時,會觸發此事件,包括由於不支援懸停的裝置觸發 pointerdown 事件(參見 pointerdown)。此事件型別類似於 pointerover,但不同之處在於它不會冒泡。

pointerdown

當指標變為活動狀態時,會觸發該事件。對於滑鼠,當裝置從未按下按鈕過渡到至少按下按鈕時,會觸發該事件。對於觸控,當手指與數字化儀發生物理接觸時,會觸發該事件。對於筆,當觸控筆與數字化儀發生物理接觸時,會觸發該事件。

注意: 對於支援直接操作的觸控式螢幕瀏覽器,pointerdown 事件會觸發隱式指標捕獲,導致目標捕獲所有後續指標事件,如同它們發生在捕獲目標之上一樣。因此,只要此捕獲處於設定狀態,pointeroverpointerenterpointerleavepointerout **將不會觸發**。可以透過在目標元素上呼叫 element.releasePointerCapture 來手動釋放捕獲,或者在 pointeruppointercancel 事件後隱式釋放。

pointermove

當指標座標改變時,會觸發此事件。

pointerrawupdate 實驗性

當指標的任何屬性發生變化時,會觸發此事件。

pointerup

當指標不再活動時,會觸發此事件。

pointercancel

如果瀏覽器認為指向裝置將無法再生成事件(例如,相關裝置已停用),則會觸發此事件。

pointerout

此事件可能因多種原因觸發,包括:指向裝置移出元素的命中測試邊界;為不支援懸停的裝置觸發 pointerup 事件(參見 pointerup);在觸發 pointercancel 事件之後(參見 pointercancel);當筆觸控筆離開數字化儀可檢測的懸停範圍時。

pointerleave

當指向裝置移出元素的命中測試邊界時,會觸發此事件。對於筆裝置,當觸控筆離開數字化儀可檢測的懸停範圍時,會觸發此事件。

gotpointercapture

當元素接收到指標捕獲時,會觸發此事件。

lostpointercapture

在指標的指標捕獲被釋放後,會觸發此事件。

示例

每個屬性、事件型別和全域性事件處理程式的示例都包含在各自的參考頁面中。

規範

規範
指標事件
# pointerevent-interface

瀏覽器相容性

另見