Javascript mousemove事件侦听器未按预期工作

我试图使特定的

元素保持可见，仅当我的鼠标位于

元素内并在

元素内移动时。如果鼠标位于

元素外部或固定在

元素内，则应隐藏

元素

我使用的是

mousemove

事件侦听器，在查看之后，它将

mousemove

事件定义为“当指向设备（通常是鼠标）在元素上移动时，

mousemove

事件被触发。”

但是，如果在HTML代码段上测试代码，我的情况似乎不是这样，因为一旦我的鼠标在

元素中移动，它确实会生成

元素，但是超时触发并隐藏一段时间后，它仍然会消失。在iframe元素内移动鼠标似乎不会再次触发

mousemove

事件，直到将鼠标移到

iframe

窗口外，然后再次将其移回

另外，当我将鼠标从

元素外部移动到元素内部时，

mousemove

事件并不总是被触发

请有人向我解释一下，当鼠标在

元素内移动时，为什么不会再次触发

mousemove

事件，并向我演示如何实现我的

元素，使其仅在鼠标在

元素内移动时才出现

我是否误解了mozilla文档中关于

mousemove

事件的定义，可以在上面的链接中找到？因为根据我的理解，这意味着当鼠标在元素内移动时，

mousemove

事件将被触发

非常感谢你，圣诞快乐

函数showP（）{
document.getElementById（'p'）.classList.remove（'hide'）；
}
函数hideP（）{
document.getElementById（'p'）.classList.add（'hide'）；
}
无功定时器；
document.getElementsByClassName（'iframe'）[0].addEventListener（'mousemove'，function（）{
console.log（'Entered iframe'）；
清除超时（计时器）；
showP（）；
定时器=设置超时（hideP，3000）；
});
.hide{
显示：无；
}


显示P标签
iFrame可能很棘手。您可以尝试将iframe包装在div中，并在JS中以该div为目标：

<div class="iframe" width="100px" height="100px">
   <iframe src="https://test.com/" width="100px" height="100px">
   </iframe>
</div>

请参阅工作代码笔：
您是否尝试过onmouseover和onmouseout？当iframe触发onmouseover时，您显示，当iframe触发onmouseout时，您隐藏。@vlam我尝试了
onmouseover
和
onmouseout
，但它们仅在您从外部移入元素时触发，反之亦然，
onnmouseout
，当你在元素中移动鼠标时，不要工作。目前看来，
mousemove
事件的行为方式与
onmouseover
完全相同，即当您将鼠标从
iframe
外部移动到内部时，它只会触发一次。但它并没有解决我的另一个问题，那就是当鼠标在元素内移动时重新触发它。刚刚尝试过它，但不幸的是，在将它放置在div中之后，事件似乎不再想要触发。请参阅：。好的，您还需要一件事，添加CSS指针事件：无；为了你的健康。然后它就起作用了。检查：它不起作用，因为您仍在覆盖，所以没有检测到您的mousemove事件。另一种方法是将div绝对定位在iframe上。谢谢，设置
指针事件：none
，有助于使其工作，但现在不幸的是，正因为如此，我在iframe上加载的站点无法检测到其任何单击事件。我发现了以下内容，我甚至可以使用它来检测容器div上的点击，然后，如果它有效，希望将事件传递给iframe，但是这可能仍然不准确，因为我无法为iframe定义触发点击事件的鼠标位置。你有解决这个问题的办法吗？谢谢。没关系，伙计，非常感谢，你肯定回答了我的问题，帮我解决了问题。给你一个我试图从中实现的背景，基本上是你在桌面模式下观看任何YouTube视频时会看到的东西。当您将鼠标移到视频上时，会出现控件，如果您停止移动鼠标，或将其移到视频播放器外，那么控件会在一段时间后消失，我想制作一个类似的覆盖，以便在一组iframe源之间切换：），但不会中断iframe源鼠标事件。
iframe {
pointer-events: none;
}