Element:pointermove 事件
>pointermove 事件会在指针坐标变化,并且没有被浏览器的触摸动作取消时触发。此事件也会在指针的其他属性变化时触发,但前提是此变化不会产生其他指针事件。此种情况包括指针的压力、侧向压力、倾斜、轴向旋转、接触面(宽度和高度)和组合按键的任何变化。
如果事件循环中存在具有相同指针 ID 的其他未被派发的 pointermove 事件,pointermove 事件可能会被合并。如果事件被合并了,被派发的事件的 target 会与最后一个被合并的事件相同。关于被合并事件的信息,参见 PointerEvent.getCoalescedEvents() 文档。
此事件与 mousemove 事件非常相似,但拥有更多特性。此事件无论有无指针按键被按下都会触发。此事件能够以极高的速率触发,取决于用户移动指针的速度、机器的运行速度以及其他正在运行的任务和进程等。
pointerrawupdate 与 pointermove 的区别在于它们的触发频率。浏览器可能会推迟 pointermove 事件以改善性能,而 pointerrawupdate 事件则是浏览器能多快频率产生就多快频率派发。对于大多数使用场景,更推荐选择 pointermove 来避免性能问题。
语法
在 addEventListener() 中使用此事件名称:
addEventListener("pointermove", (event) => { })
或者,对接口的事件处理器属性赋值:
onpointermove = (event) => { }
事件类型
PointerEvent。继承自 Event。
使用说明
PointerEvent 类型的事件提供了全部你需要知道的关于用户与定点设备交互的信息,包括位置、移动距离、按钮状态等等。
示例
使用 addEventListener() 为 pointermove 事件添加一个处理器:
const para = document.querySelector("p");
para.addEventListener("pointermove", (event) => {
console.log("指针移动了");
});
也可以使用 onpointermove 事件处理器属性(但请注意,这会替换掉之前使用 onpointermove 添加的其他事件监听器,如存在的话):
const para = document.querySelector("p");
para.onpointermove = (event) => {
console.log("指针移动了");
};
规范
| 规范 |
|---|
| Pointer Events> # pointermove> |
| Pointer Events> # dom-globaleventhandlers-onpointermove> |