时间戳

首页 > 解决方案 > 当指针在浏览器内快速移动时，MouseEvent.movementX 返回不正确的值

javascript - 当指针在浏览器内快速移动时，MouseEvent.movementX 返回不正确的值

问题描述

我一直在开发一个基于鼠标移动的功能，它用于movementX运行。它工作得很好，但我注意到它有时会有奇怪的行为。当我深入研究它时，我发现该物业似乎存在问题movementX。

MDN声明：

MouseEvent 接口的 moveX 只读属性提供了给定事件和前一个 mousemove 事件之间鼠标指针 X 坐标的差异。换句话说，属性的值是这样计算的： currentEvent.movementX = currentEvent.screenX - previousEvent.screenX.

但情况并非总是如此。screenX如果您从浏览器外部快速移动指针，内部，由于某种原因，该值可能等于甚至大于。由于我无法在 JSFiddle 中重现此内容，因此我使用了这个简单的文档并在 Chrome 中打开了它：

<!DOCTYPE html>
<html>
<head>
  <title></title>
</head>
<body>
  <script>
    document.addEventListener('mousemove', (event) => {
      console.log('movementX:', event.movementX, 'clientX:', event.clientX, 'innerWidth:', window.innerWidth)
    })
  </script>
</body>
</html>

这是描述问题的图像：

运动X问题

如您所见，该movementX值飙升至914。根据该属性的 MDN 描述，它应该返回当前screenX值849与前一个值之间的差值，即849. 而不是属性等于0，914而是相反。

为什么会这样？

浏览器：Chrome，版本 72.0.3626.109（官方版本）（64 位）

标签： javascriptgoogle-chromemouseevent

解决方案

原来这是Chrome中的一个错误。我已经在这里报告了。

推荐阅读