Question

我想使用一个侦听器，当鼠标离开屏幕时，该侦听器将触发一个功能。我正在使用以下代码：

content = 'blabla';
document.addEventListener("mouseleave", function(){ display_exit(content);  });
function display_exit(content)
{ console.log(content); }

当我在Chrome上执行此代码时，它在Firefox或Explorer / Edge上也可以正常工作。

在我的语法中，Chrome是否可以容忍某些东西，而其他的不是？

谢谢

洛朗

Answer 1

该事件仅是specified for类型的Element个节点，而不是Node或Documents的事件：

类型鼠标离开

...

受信任的目标元素

...

您可以将侦听器附加到documentElement，它将起作用：

document.documentElement.addEventListener("mouseout", ...);

此外，请确保文档（html元素）的高度为100％，否则，根据其内容可能甚至还没有进入document元素，因此不会触发请假。

请参见以下工作提琴：https://jsfiddle.net/b3wtoayq/

根据规范，我认为这是Chrome中的错误，允许将事件监听器附加到文档本身。

Answer 2

“ mouseleave”事件由Element对象触发，并且不会冒泡。文档（document不是Element，因此由于上述两个因素的结合，将事件侦听器附加到文档上没有任何作用。

这与Firefox无关。它是由Web标准组织W3C在这种情况下提议设计的。如果有的话，Firefox会遵守该规范，显然这是关于Chrome不能说的。

在使用它之前，请始终咨询所用技术的权威参考，并质疑自己认为是错误的行为：UI Events, W3C Working Draft（其中MDN用作来源）

您的解决方案是修改代码，考虑是否可以使用"mouseout" event instead, which does bubble，还是将事件侦听器附加到要侦听“多声”事件的元素上，包括{ {1}}元素（如果适用）。

Javascript = AddEventlistener仅在Chrome上运行

2 个答案: