在此页

• 构造函数
• 特性
• 方法
• Pointer event types
• GlobalEventHandlers
• 范例
• 规范
• 浏览器兼容性
• 另请参阅
• 相关话题

PointerEvent interface represents the state of a DOM event produced by a pointer such as the geometry of the contact point, the device type that generated the event, the amount of pressure that was applied on the contact surface, etc.

A pointer is a hardware agnostic representation of input devices (such as a mouse, pen or contact point on a touch-enable surface). The pointer can target a specific coordinate (or set of coordinates) on the contact surface such as a screen.

A pointer's hit test is the process a browser uses to determine the target element for a pointer event. Typically, this is determined by considering the pointer's location and also the visual layout of elements in a document on screen media.

构造函数

PointerEvent()

Creates a synthetic—and untrusted— PointerEvent .

特性

此接口继承特性从 MouseEvent and 事件 .

PointerEvent.pointerId 只读

A unique identifier for the pointer causing the event.

PointerEvent.width 只读

The width (magnitude on the X axis), in CSS pixels, of the contact geometry of the pointer.

PointerEvent.height 只读

The height (magnitude on the Y axis), in CSS pixels, of the contact geometry of the pointer.

PointerEvent.pressure 只读

The normalized pressure of the pointer input in the range 0 to 1 ，其中 0 and 1 represent the minimum and maximum pressure the hardware is capable of detecting, respectively.

PointerEvent.tangentialPressure 只读

The normalized tangential pressure of the pointer input (also known as barrel pressure or cylinder stress ) in the range -1 to 1 ，其中 0 is the neutral position of the control.

PointerEvent.tiltX 只读

The plane angle (in degrees, in the range of -90 to 90 ) between the Y–Z plane and the plane containing both the pointer (e.g. pen stylus) axis and the Y axis.

PointerEvent.tiltY 只读

The plane angle (in degrees, in the range of -90 to 90 ) between the X–Z plane and the plane containing both the pointer (e.g. pen stylus) axis and the X axis.

PointerEvent.twist 只读

The clockwise rotation of the pointer (e.g. pen stylus) around its major axis in degrees, with a value in the range 0 to 359 .

PointerEvent.pointerType 只读

Indicates the device type that caused the event (mouse, pen, touch, etc.)

PointerEvent.isPrimary 只读

Indicates if the pointer represents the primary pointer of this pointer type.

方法

PointerEvent.getCoalescedEvents()

Returns a sequence of all PointerEvent instances that were coalesced into the dispatched pointermove 事件。

PointerEvent.getPredictedEvents()

Returns a sequence of PointerEvent instances that the browser predicts will follow the dispatched pointermove event's coalesced events.

Pointer event types

PointerEvent interface has several event types. To determine which event fired, look at the event's type 特性。

注意： It's important to note that in many cases, both pointer and mouse events get sent (in order to let non-pointer-specific code still interact with the user). If you use pointer events, you should call event.preventDefault() to keep the mouse event from being sent as well.

pointerover

This event is fired when a pointing device is moved into an element's hit test boundaries.

pointerenter

This event is fired when a pointing device is moved into the hit test boundaries of an element or one of its descendants, including as a result of a pointerdown event from a device that does not support hover (see pointerdown). This event type is similar to pointerover , but differs in that it does not bubble.

pointerdown

The event is fired when a pointer becomes active . For mouse, it is fired when the device transitions from no buttons depressed to at least one button depressed. For touch, it is fired when physical contact is made with the digitizer. For pen, it is fired when the stylus makes physical contact with the digitizer.

pointermove

This event is fired when a pointer changes coordinates.

pointerrawupdate

This event is fired when any of a pointer's properties change.

pointerup

This event is fired when a pointer is no longer active .

pointercancel

A browser fires this event if it concludes the pointer will no longer be able to generate events (for example the related device is deactived).

pointerout

This event is fired for several reasons including: pointing device is moved out of the hit test boundaries of an element; firing the pointerup event for a device that does not support hover (see pointerup ); after firing the pointercancel event (see pointercancel ); when a pen stylus leaves the hover range detectable by the digitizer.

pointerleave

This event is fired when a pointing device is moved out of the hit test boundaries of an element. For pen devices, this event is fired when the stylus leaves the hover range detectable by the digitizer.

gotpointercapture

This event is fired when an element receives pointer capture.

lostpointercapture

This event is fired after pointer capture is released for a pointer.

GlobalEventHandlers

GlobalEventHandlers.onpointerover

global event handler 为 pointerover 事件。

GlobalEventHandlers.onpointerenter

global event handler 为 pointerenter 事件。

GlobalEventHandlers.onpointerdown

global event handler 为 pointerdown 事件。

GlobalEventHandlers.onpointermove

global event handler 为 pointermove 事件。

GlobalEventHandlers.onpointerup

global event handler 为 pointerup 事件。

GlobalEventHandlers.onpointercancel

global event handler 为 pointercancel 事件。

GlobalEventHandlers.onpointerout

global event handler 为 pointerout 事件。

GlobalEventHandlers.onpointerleave

global event handler 为 pointerleave 事件。

范例

Examples of each property, event type, and global event handler are included in their respective reference pages.

规范

规范	状态	注释
Pointer Events – Level 3 The definition of 'PointerEvent' in that specification.	编者草案	添加 getCoalescedEvents() and getPredictedEvents() methods and pointerrawupdate 事件。
指针事件 – 2 级 The definition of 'PointerEvent' in that specification.	推荐	添加 twist and tangentialPressure 特性。
指针事件 The definition of 'PointerEvent' in that specification.	过时	初始定义。

浏览器兼容性

The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request. 更新 GitHub 上的兼容性数据

	桌面						移动
	Chrome	Edge	Firefox	Internet Explorer	Opera	Safari	Android webview	Chrome for Android	Firefox for Android	Opera for Android	Safari on iOS	Samsung Internet
PointerEvent	Chrome 55	Edge 12	Firefox 59 59 Disabled ). To change preferences in Firefox, visit	IE 11 11 部分支持 10 Prefixed Prefixed Implemented with the vendor prefix: MS 见 MSDN Pointer events updates .	Opera 42	Safari 13	WebView Android 55	Chrome Android 55	Firefox Android 41	Opera Android 42	Safari iOS 13	Samsung Internet Android 6.0
PointerEvent() 构造函数	Chrome 55	Edge 12	Firefox 59 59 Disabled ). To change preferences in Firefox, visit	IE 11 11 部分支持 10 Prefixed Prefixed Implemented with the vendor prefix: MS 见 MSDN Pointer events updates .	Opera 42	Safari 13	WebView Android 55	Chrome Android 55	Firefox Android 41	Opera Android 42	Safari iOS 13	Samsung Internet Android 6.0
getCoalescedEvents	Chrome 58	Edge 79	Firefox 59	IE No	Opera 45	Safari No	WebView Android 58	Chrome Android 58	Firefox Android 部分支持 59 Disabled 部分支持 59 Disabled Disabled ). To change preferences in Firefox, visit	Opera Android 43	Safari iOS No	Samsung Internet Android 7.0
height	Chrome 55	Edge 12	Firefox 59 59 Disabled ). To change preferences in Firefox, visit	IE 11 11 部分支持 10 Returns values in screen pixels instead of CSS document pixels.	Opera 42	Safari 13	WebView Android 55	Chrome Android 55	Firefox Android 41	Opera Android 42	Safari iOS 13	Samsung Internet Android 6.0
isPrimary	Chrome 55	Edge 12	Firefox 59 59 Disabled ). To change preferences in Firefox, visit	IE 10	Opera 42	Safari 13	WebView Android 55	Chrome Android 55	Firefox Android 41	Opera Android 42	Safari iOS 13	Samsung Internet Android 6.0
pointerId	Chrome 55	Edge 12	Firefox 59 59 Disabled ). To change preferences in Firefox, visit	IE 10	Opera 42	Safari 13	WebView Android 55	Chrome Android 55	Firefox Android 41	Opera Android 42	Safari iOS 13	Samsung Internet Android 6.0
pointerType	Chrome 55	Edge 12	Firefox 59 59 Disabled ). To change preferences in Firefox, visit	IE 11 11 部分支持 10 Returns an integer enumeration instead of a string.	Opera 42	Safari 13	WebView Android 55	Chrome Android 55	Firefox Android 41	Opera Android 42	Safari iOS 13	Samsung Internet Android 6.0
pressure	Chrome 55	Edge 12	Firefox 59 59 Disabled ). To change preferences in Firefox, visit	IE 11 11 部分支持 10 Returns 0 instead of 0.5 on hardware that doesn't support pressure.	Opera 42	Safari 13	WebView Android 55	Chrome Android 55	Firefox Android 41	Opera Android 42	Safari iOS 13	Samsung Internet Android 6.0
tangentialPressure	Chrome 58	Edge 79	Firefox 59 59 Disabled ). To change preferences in Firefox, visit	IE No	Opera 45	Safari 13	WebView Android 58	Chrome Android 58	Firefox Android 54	Opera Android 43	Safari iOS 13	Samsung Internet Android 7.0
tiltX	Chrome 55	Edge 12	Firefox 59 59 Disabled ). To change preferences in Firefox, visit	IE 10	Opera 42	Safari 13	WebView Android 55	Chrome Android 55	Firefox Android 41	Opera Android 42	Safari iOS 13	Samsung Internet Android 6.0
tiltY	Chrome 55	Edge 12	Firefox 59 59 Disabled ). To change preferences in Firefox, visit	IE 10	Opera 42	Safari 13	WebView Android 55	Chrome Android 55	Firefox Android 41	Opera Android 42	Safari iOS 13	Samsung Internet Android 6.0
twist	Chrome 58	Edge 18	Firefox 59 59 Disabled ). To change preferences in Firefox, visit	IE No	Opera 45	Safari 13	WebView Android 58	Chrome Android 58	Firefox Android 54	Opera Android 43	Safari iOS 13	Samsung Internet Android 7.0
width	Chrome 55	Edge 12	Firefox 59 59 Disabled ). To change preferences in Firefox, visit	IE 11 11 部分支持 10 Returns values in screen pixels instead of CSS document pixels.	Opera 42	Safari 13	WebView Android 55	Chrome Android 55	Firefox Android 41	Opera Android 42	Safari iOS 13	Samsung Internet Android 6.0

图例

完整支持

完整支持

部分支持

部分支持

不支持

不支持

实验。期望将来行为有所改变。

实验。期望将来行为有所改变。

见实现注意事项。

用户必须明确启用此特征。

用户必须明确启用此特征。

要求使用供应商前缀或不同名称。

要求使用供应商前缀或不同名称。

另请参阅

• 触摸事件
• GestureEvent
• MSGestureEvent
• touch-action

元数据

• 最后修改： Mar 6, 2020

相关话题

1. 指针事件
2. PointerEvent
3. 构造函数

   1. PointerEvent()
4. 特性

   1. height
   2. isPrimary
   3. pointerId
   4. pointerType
   5. pressure
   6. tangentialPressure
   7. tiltX
   8. tiltY
   9. twist
   10. width
5. 方法

   1. getCoalescedEvents()
6. 继承：

   1. MouseEvent
   2. UIEvent
   3. 事件
7. Related pages for Pointer Events

   1. Element.ongotpointercapture
   2. Element.onlostpointercapture
   3. Element.releasePointerCapture()
   4. Element.setPointerCapture()
   5. GlobalEventHandlers.onpointercancel
   6. GlobalEventHandlers.onpointerdown
   7. GlobalEventHandlers.onpointerenter
   8. GlobalEventHandlers.onpointerleave
   9. GlobalEventHandlers.onpointermove
   10. GlobalEventHandlers.onpointerout
   11. GlobalEventHandlers.onpointerover
   12. GlobalEventHandlers.onpointerup
   13. Navigator.maxTouchPoints