Javascript 在浏览器/窗口外捕获鼠标悬停事件

现在我正在停止鼠标向上拖动事件，如下所示：

$(document).mouseup(_onMouseUp);

但是，当鼠标离开浏览器窗口时，我需要捕获鼠标启动事件，类似于Flash中的

releaseOutside

---

这在JS中是可能的吗？

您无法在浏览器窗口外检测到mouseup或mousedown事件，但我认为您试图做的是在用户单击浏览器窗口时取消拖放。您可以通过对浏览器窗口失去焦点作出反应来实现这一点，例如：

$(window).on("blur", function(e) {
    // Cancel my drag and drop here
});

或

---

这包括在浏览器窗口外单击鼠标，以及Windows Alt+Tab任务切换。

是的，可以在浏览器窗口外捕获鼠标移动事件。只需在mousedown回调中调用

记住也要去拜访mouseup

elem.addEventListener('mousedown', function() {
    ...
    elem.setCapture();
});
elem.addEventListener('mouseup', function() {
    ...
    document.releaseCapture();
});

---

您可以在每个主要浏览器（Chrome、Edge和Firefox）的浏览器窗口外捕获鼠标移动事件

您只需将侦听器连接到“窗口”对象，如下所示：

window.addEventListener('mouseup', 
                         () => console.log('mouse up captured outside the window'));

或者在您的情况下，使用jQuery，它将是：

$(window).mouseup(_onMouseUp);

---

可以在浏览器窗口外捕获鼠标上升事件，如下所示：

elem.addEventListener('mousedown', function(e) {
    ...
    elem.setPointerCapture(e.pointerId);
});
elem.addEventListener('mouseup', function(e) {
    ...
    elem.releasePointerCapture(e.pointerId);
});

参考资料：

---

键盘/鼠标事件仅在浏览器处于焦点状态时有效（除非您是IE:）。这将是一个巨大的安全漏洞。正如我在下面的回答中详述的，可以检测到文档失去了焦点。这可能会实现OP想要的功能。我想应该是

窗口

而不是

文档

，请参见我已经在所有5种主要浏览器和几种类型的设备上测试了

文档

。但是，请随意使用

窗口

，也可以。仅供参考。Chrome尚不支持setCapture（）。是的，但Chrome默认情况下不捕获鼠标吗？我不知道，但即使它捕获了，elem.setCapture（）当前也会在Chrome中引发异常，因此，仍然需要一些注意。

releaseCapture

不是必需的，除非您想在

mouseup

之前释放捕获。请参阅MDN建议，因为它具有更广泛的浏览器支持。它的工作原理基本相同，但您必须向它传递一个指针ID。您可以从

pointerdown

事件中获取指针ID，该事件应该用来代替

mousedown

。我猜指针ID可能是用于多点触摸界面的-从我的测试来看，它似乎总是1。它在Chrome上对我不起作用。我拖出一个图像，但当我把它放在桌面上时，事件不会被触发。它在Chrome上对我不起作用。我拖出一个图像，但当我将其留在桌面上时，事件不会被触发。@YTG如果您正在进行拖放，请执行以下操作：window.addEventListener（“dragend”，（）=>console.log（'drag end event capture'）；如果将其放置在浏览器窗口之外，则此操作将起作用。

elem.addEventListener('mousedown', function(e) {
    ...
    elem.setPointerCapture(e.pointerId);
});
elem.addEventListener('mouseup', function(e) {
    ...
    elem.releasePointerCapture(e.pointerId);
});