TouchEvent

构造函数

TouchEvent()

创建一个 TouchEvent 对象。

实例属性

此接口继承自其父接口 UIEvent 和 Event 的属性。

TouchEvent.altKey 只读

一个布尔值，指示触发触摸事件时 alt 键是否被按下。

TouchEvent.changedTouches 只读

一个 TouchList，其中包含所有 Touch 对象，这些对象代表了在之前的触摸事件和当前事件之间状态发生变化的个人接触点。

TouchEvent.ctrlKey 只读

一个布尔值，指示触发触摸事件时 control 键是否被按下。

TouchEvent.metaKey 只读

一个布尔值，指示触发触摸事件时 meta 键是否被按下。

TouchEvent.shiftKey 只读

一个布尔值，指示触发触摸事件时 shift 键是否被按下。

TouchEvent.targetTouches 只读

一个 TouchList，包含所有当前与触摸表面接触的 Touch 对象，并且这些对象也是在与事件目标相同的元素上开始触摸的。

TouchEvent.touches 只读

一个 TouchList，包含所有表示与表面接触点的 Touch 对象，无论其目标或变化状态如何。

TouchEvent.rotation 非标准 只读

自事件开始以来的旋转变化（以度为单位）。正值表示顺时针旋转；负值表示逆时针旋转。初始值：0.0。

TouchEvent.scale 非标准 只读

自事件开始以来两个手指之间的距离。表示为初始手指距离的浮点数倍。小于 1.0 的值表示向内捏合（缩小）。大于 1.0 的值表示向外张开（放大）。初始值：1.0。

触摸事件类型

有几种类型的事件可以触发，以指示发生了与触摸相关的更改。您可以通过查看事件的 TouchEvent.type 属性来确定发生了哪种事件。

touchstart

当用户将触摸点放在触摸表面上时发送。事件的目标将是发生触摸的 element。

touchend

当用户将触摸点从表面移开时发送；也就是说，当他们抬起手指或触控笔离开表面时。如果触摸点移出表面的边缘，也会发送此事件；例如，如果用户的手指滑出了屏幕边缘。

事件的目标是与触摸点相对应的 touchstart 事件所接收的同一个 element，即使触摸点已移出该元素之外。

可以从 changedTouches 属性指定的 TouchList 中找到从表面移除了的一个或多个触摸点。

touchmove

当用户沿表面移动触摸点时发送。事件的目标是与触摸点相对应的 touchstart 事件所接收的同一个 element，即使触摸点已移出该元素之外。

如果触摸点的 radius、rotation angle 或 force 属性的值发生变化，也会发送此事件。

注意： touchmove 事件的发送速率是浏览器特定的，并且可能因用户硬件的功能而异。您不应依赖于这些事件的特定粒度。

touchcancel

当触摸点因某种原因被中断时发送。可能发生这种情况的原因有多种（确切原因因设备和浏览器而异）。

• 发生了一些导致触摸取消的事件；例如，如果在交互过程中弹出了模态警告框。
• 触摸点已离开文档窗口并移入浏览器的 UI 区域、插件或其他外部内容。
• 用户在屏幕上放置的触摸点数量超出了支持的范围，在这种情况下，TouchList 中的最早的 Touch 会被取消。

与 addEventListener() 和 preventDefault() 一起使用

值得注意的是，在许多情况下，触摸事件和鼠标事件都会被发送（以允许非触摸特定的代码仍能与用户进行交互）。如果您使用触摸事件，则应调用 preventDefault() 以防止鼠标事件也被发送。

例外情况是 Chrome，从 56 版本开始（桌面版、Chrome for Android 和 Android webview），touchstart 和 touchmove 的 passive 选项的默认值为 true，调用 preventDefault() 将不起作用。要覆盖此行为，您需要将 passive 选项设置为 false，之后调用 preventDefault() 将按预期工作。将侦听器默认视为 passive 的更改可防止侦听器在用户滚动时阻止页面渲染。Chrome 开发者网站上提供了演示：Chrome Developer。

示例

请参阅 主触摸事件文章中的示例。

规范

浏览器兼容性

另见

• 触摸事件
• GestureEvent