在Chrome和Firefox中停止onmouseenter重复触发

的方法是使用事件委托和事件标志。

事件委托是指将事件绑定到父元素上，然后通过事件冒泡机制来处理子元素的事件。这样可以避免给每个子元素都绑定事件，提高性能。

事件标志是指在事件处理函数中设置一个标志，用于判断是否已经执行过该事件处理函数。当事件触发时，先检查标志，如果已经执行过，则直接返回，不再重复触发。

下面是一个示例代码：

<!DOCTYPE html>
<html>
<head>
  <title>Stop onmouseenter from firing repeatedly in Chrome and Firefox</title>
  <style>
    .parent {
      width: 200px;
      height: 200px;
      background-color: lightblue;
    }
    .child {
      width: 100px;
      height: 100px;
      background-color: lightgreen;
    }
  </style>
</head>
<body>
  <div class="parent">
    <div class="child"></div>
  </div>

  <script>
    var parent = document.querySelector('.parent');
    var child = document.querySelector('.child');
    var isMouseEntered = false;

    parent.addEventListener('mouseenter', function() {
      if (isMouseEntered) {
        return;
      }
      console.log('Mouse entered parent');
      isMouseEntered = true;
    });

    parent.addEventListener('mouseleave', function() {
      console.log('Mouse left parent');
      isMouseEntered = false;
    });

    child.addEventListener('mouseenter', function() {
      console.log('Mouse entered child');
    });

    child.addEventListener('mouseleave', function() {
      console.log('Mouse left child');
    });
  </script>
</body>
</html>

在上面的代码中，我们使用了一个布尔型变量isMouseEntered来标志鼠标是否已经进入了父元素。在父元素的mouseenter事件处理函数中，我们首先检查isMouseEntered的值，如果为true，则直接返回，不再重复触发。在父元素的mouseleave事件处理函数中，我们将isMouseEntered的值设为false，表示鼠标已经离开了父元素。

这样，在Chrome和Firefox中，当鼠标进入父元素时，只会触发一次mouseenter事件，而不会重复触发。