在 mousedown 事件中添加的 mousemove 事件在鼠标不移动时保持触发

Question

我正在处理一个简单的鼠标事件侦听器序列，其形式为“mousedown”->“mousemove”->“mouseup”。我想要做的是在 mousedown 事件触发时为 mousemove 和 mouseup 添加两个事件监听器。

我的代码如下所示：

document.addEventListener("mousedown",stagesContainerGrabMouseDownHandler)

function stagesContainerGrabMouseDownHandler(ev){
      document.addEventListener("mousemove",stagesContainerGrabMouseMoveHandler);
        document.addEventListener("mouseup",stagesContainerGrabMouseUpHandler)
}

function stagesContainerGrabMouseMoveHandler(ev){
        console.log(12)
}

function stagesContainerGrabMouseUpHandler(ev){
    document.removeEventListener("mousemove",stagesContainerGrabMouseMoveHandler);
    document.removeEventListener("mouseup",stagesContainerGrabMouseUpHandler);
}

问题是当我按住鼠标时，mousemove 事件持续触发，即使我的鼠标保持不动。我正在使用 Chrome.

Answer 1

看来问题一定出在其他地方 — 可能是其他代码或您使用的鼠标。

我测试了您包含在 DevTools 控制台中的代码（在 Edge 和 Chrome 中），当我按住鼠标不动时事件没有触发。

Answer 2

所以我找到了罪魁祸首。我什至没有想到去那里看看。我是运行一个在后台使用 AutoHotKey 的脚本，出于某种原因，它似乎与我的页面交互。关闭它解决了问题。

在 mousedown 事件中添加的 mousemove 事件在鼠标不移动时保持触发

Mousemove event added in mousedown event keeps firing while the mouse is not moving

javascript

addeventlistener

mousemove

dom-events

mousedown