如何在javascript中将鼠标悬停在div上时只发出一次声音

我有几个div的类名是“soundWhenHover”。 每当我将鼠标悬停在音频上时，我都想播放音频（咔哒声）。我可以通过使用类名迭代元素并为mouseover添加事件侦听器来实现这一点。但是，如果在div周围移动鼠标，则会多次发出声音。我只希望音频在你每次悬停在div上时播放一次。

---

我添加了一个布尔值，它在鼠标悬停时变为true，然后在鼠标悬停时变为false。问题是div有子元素，当您将鼠标悬停在这些元素上时，它将被视为鼠标出。如何为div和元素发出一次声音？

只需将声音绑定到父元素的mouseenter事件：

const mouseTarget=document.getElementById（'mouseTarget'）；
addEventListener（'mouseenter'，e=>{
console.log（“播放声音”）；
});
#mouseTarget，#child{
边框：1px实心#333；
}
#老鼠{
填充物：5px；
宽度：300px；
高度：50px；
}
#孩子{
填充物：5px；
宽度：200px；
高度：20px；
}

试验
只需将声音绑定到父元素的mouseenter事件。XD我甚至没有想到mouseenter。谢谢编辑：试过了，效果很好，非常感谢！没问题。我补充了我的评论作为回答