使用Javascript加载页面时，检测鼠标是否位于元素上方

我有一个图像，我想让它在鼠标结束时触发某些行为，我有一个mouseover和mouseout方法，但是如果你在页面加载时碰巧将鼠标放在图像上，mouseover方法在你离开图像并返回图像之前不会触发

---

有没有一种方法可以检测鼠标是否在移动中越过某个元素，而无需鼠标离开该元素，然后越过该元素来触发JS mouseover事件？Javascript中是否有document.getElementById（“blah”）.mouseover（）类型的函数？

除了侦听鼠标事件之外，无法获取鼠标坐标，即

mousemove

，

mouseover

等，这些事件非常敏感，因为仅移动光标一个像素就足以触发它们，因此让光标在完全静止的情况下悬停在图像上应该有些不寻常。

您可以使用mousemove事件。这将在用户移动鼠标时触发；因此，如果用户根本不移动鼠标，那么触发器就不会触发，这应该是很少见的

唯一的问题是，当鼠标移动到您的图像上时，事件将随时触发，因此在组件上时，您将获得大量这些事件。您可能需要做的是在事件触发时在方法中实现某种标志。当事件第一次激发时打开该标志，当您离开组件时关闭该标志

这不太理想，但我认为这可能会满足您的问题场景。下面是一些关于该解决方案的快速伪代码，我认为它应该可以工作

<img src="blah.png" onmousemove="JavaScript:triggerOn(event)" onmouseout="JavaScript:triggerOff(event)"/>


...

<script type='text/javascript'>

var TriggerActive = false;

function triggerOn(e){
  e = e||window.e;
  if( !TriggerActive){
    TriggerActive = true;
    // Do something
  } else {
    // Trigger already fired, ignore this event.
  }
}

function triggerOff(e){
  e = e||window.e;
  if(TriggerActive) 
    TriggerActive = false;
}

</script>

...
var TriggerActive=false；
函数triggerOn（e）{
e=e | | window.e；
if（！TriggerActive）{
TriggerActive=true；
//做点什么
}否则{
//触发器已触发，忽略此事件。
}
}
函数触发器关闭（e）{
e=e | | window.e；
如果（触发活动）
TriggerActive=false；
}

---

您可以找到一些很棒的鼠标事件信息，包括浏览器兼容性说明。

我相信这是不需要用户采取任何行动就可以做到的。加载页面时，将

mouseover

事件绑定到图像并隐藏图像（即使用CSS

display:none

）。使用

setTimeout（）

在几毫秒后再次显示它（10应该足够了）。警察应该被解雇

如果不想在图像上造成“flick”效果，可以尝试使用一些临时元素，将事件附加到它，并将事件委派到图像上

---

我不知道这是否是跨浏览器解决方案，但它在我的Firefox 3.0控制台上工作；）

使用document.querySelectpor和onload/onready事件

var a = document.querySelector('#a:hover');
if (a) {
   // Mouse cursor is above a
}
else {
   // Mouse cursor is outside a
}

---

很好的解决方法。将其与.addEventListener（“mouseenter”，函数）混合使用似乎是一个很好的解决方案。这很好。它在Chrome和Firefox中工作。它至少在IE下通过v8引擎工作。谢谢