使用jQuery检查mouseleave（）上光标所在的元素？

Question

我有一组列表元素（<li>中的<ul>）在这样的图表上显示为气泡，其中气泡是<li>元素：

http://i.stack.imgur.com/PR7vR.png

我希望能够发现

之间的区别

1. 将鼠标从气泡＃1移动到网格
2. 将鼠标从气泡＃1 直接移至另一个气泡，例如气泡2

我试图在$(this)中使用.mouseleave()即使是泡泡，但它会记录您要离开的元素，而不是您当前正在悬停的元素。

关于如何获取鼠标移动到mouseleave()上的元素的任何想法？

Answer 1

您需要使用event.toElement || e.relatedTarget：

$('li').mouseleave(function(e)
{
    // new element is: e.toElement || e.relatedTarget
});

（编辑注意|| e.relatedTarget以确保浏览器兼容性）

Answer 2

如果你可以使用常规javascript，每个事件（e）鼠标悬停和鼠标输出都有 大多数浏览器中的e.relatedTarget。 ＃9之前的IE有event.toElement和event.fromElement，具体取决于你是在听mouseover还是mouseout。

somebody.onmouseout=function(e){
  if(!e && window.event)e=event;
  var goingto=e.relatedTarget|| event.toElement;
  //do something
}
somebody.onmouseover=function(e){
  if(!e && window.event)e=event;
  var comingfrom=e.relatedTarget|| e.fromElement;
  //do something
}