Firefox Quantum 58.0.2中onMouseEnter事件不触发问题咨询

嘿，我特意去查了Firefox Quantum 58.0.2的相关兼容性记录和社区反馈，这个版本确实存在和onmouseenter/onmouseleave相关的已知问题，尤其是在特定元素场景下会触发：

• SVG元素场景的bug：Firefox 58对SVG元素上的mouseenter事件处理有明显缺陷，这是当时的一个已知问题——Chrome和Safari能正常识别SVG元素的mouseenter，但Firefox 58却无法捕获到这个事件，反而mouseover能正常工作。
• 动态元素的事件委托问题：如果你是通过父元素事件委托的方式给动态添加的元素绑定mouseenter，也容易出问题。因为mouseenter本身不冒泡，而Firefox 58的事件委托机制在处理这类不冒泡事件时，和Chrome/Safari的实现存在差异，导致事件无法正确触发。

给你几个临时解决办法：

• 若涉及SVG元素，可以用mouseover配合relatedTarget判断来模拟mouseenter的行为，示例代码如下：

  const targetElement = document.querySelector('your-svg-element');
  targetElement.addEventListener('mouseover', function(e) {
    // 判断鼠标是否是从元素外部进入
    if (!this.contains(e.relatedTarget)) {
      // 这里执行原本mouseenter事件的逻辑
      console.log('模拟mouseenter触发');
    }
  });
  

• 对于动态元素，尽量直接给目标元素绑定mouseenter事件，而不是通过父元素委托；或者最彻底的方式——升级Firefox到59及以上版本，Mozilla在59版本中修复了多个mouseenter相关的兼容性bug，后续版本就没再出现这类问题了。

内容的提问来源于stack exchange，提问作者patrickhuang94