Crossbrowser onMouseenter

Question

我有一些问题附加onMouseover整个元素和它的孩子，所以我决定看看微软onMouseenter这是基于鼠标位置，现在我想知道是否有一个跨浏览器解决方案，或至少修复onMouseover以应用于div儿童。

P.S.我不应该为此使用jQuery或其他框架。

欣赏任何想法。

Answer 1

编辑：这比我原来的一个更好的解决方案。它代替e.relatedTarget而不是this.parentNode。

似乎给了准确的结果：

if( e.relatedTarget !== this.parentNode) return; 

例子：http://jsfiddle.net/FPKKX/1/

...所以你会怎么做：

el.onmouseover = function(e) { 
    // typical event obj fix 

    if( e.relatedTarget !== this.parentNode) return; 

    // This will only log to the console for the <div> 
    console.log(e.target.tagName, e.relatedTarget.tagName); 
}; 

---

原始

该解决方案确实不完整。这将需要更好的每元素追踪，因为离开内部元素将触发外部事件。 你应该简单地能够做一个测试来复制mouseenter的行为。

例子：http://jsfiddle.net/FPKKX/（阅读代码中的注释，并打开控制台）

el.onmouseover = function(e) { 
    // typical event obj fix 

    // if the event is the result of bubbling, return. 
    if(this !== e.target) return; 

    // rest of code 
}; 

现在if()后的代码将仅在事件的目标是一样的元素火该处理程序应用于其中，从而有效地渲染事件冒泡对该事件无效。

请注意，这并不完美。如果有内部元素直接与容器的内部边缘对齐，则如果鼠标在该点处进入，则接收事件的元素可能是内部元素。需要调整。

Answer 2

如果你愿意使用一个库如jQuery，存在被做成跨浏览器的mouseenter事件：

http://api.jquery.com/mouseenter/