一旦光标离开目标元素，如何在 javascript 中跟踪鼠标移动事件?

Question

我可以使用一个简单的函数在javascript中获取鼠标运动事件：

myElement.onmousemove(function(event){
// ...
});

但我认为这些事件仅在光标悬停在元素上时才触发。我知道我也可以为document执行此操作并获取所有鼠标运动事件：

document.onmousemove(function(event){...});

但是，此事件没有属于div 或按钮或其他任何东西的"范围"，并且不会相对于我正在使用的元素进行偏移。

我的解决方法是保存一个指向焦点div 的变量，并在获取所有运动事件时引用它，但我更愿意为元素本身设置运动事件和 onmousemove 函数。有没有办法让该元素继续接收鼠标移动事件，即使光标离开元素的边界？

如果这很重要，我可以使用jQuery，但我更喜欢本机解决方案。

Answer 1

不，当移动在附加元素之外时，不可能获得mousemove事件。正如您正确所说，您可以跟踪文档上的移动。当将其与mouseenter和mouseleave事件一起使用时，您可以设置/取消设置变量以指示元素上是否发生了移动。

例如

var myElement = document.getElementById("special");
var isOverMyElement = false;
document.addEventListener('mousemove', function(e){
if (isOverMyElement){
console.log("mouse is within myelement at details", e);
}
})
myElement.addEventListener('mousenter', function(e){
isOverMyElement = true;
})
myElement.addEventListener('mousenter', function(e){
isOverMyElement = false;
})

如果您的目标是较旧的浏览器，请使用 jQuery，因为它规范了浏览器上的鼠标输入/离开。如果你的目标是现代浏览器，则不需要jQuery