如何解决MouseLeave 表现得像 MouseOut？
我觉得我快疯了...所以，根据我的理解和互联网的普遍共识，mouSEOut 会触发光标，留下一个元素或其任何子元素，而 {{ 1}} 只在离开事件附加元素的光标上触发。所以我采取了这样的准系统：
mouseleave... 当鼠标离开该 div 的任何后代时，<html>
<body>
<div id='test'>
<ul>
<li>One</li>
<li>Two</li>
<li>Three</li>
<li>Four</li>
</ul>
</div>
<script>
const div = document.getElementById('test');
div.addEventListener('mouseleave',(e) => console.log('out'),true);
</script>
</body>
</html>
事件肯定仍在触发。我觉得我一定是在做一些明显错误的事情，但是……什么？
解决方法
尝试从 addEventListener 中删除最后一个参数 - 它称为 useCapture，默认情况下为 false。如果您传递 true，when 事件将在捕获阶段触发，这将导致在每个子元素上触发 mouseleave。详细了解 useCapture 参数 - https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener
mouseleave 事件不会冒泡，因为它在离开子元素时不会触发父事件。但是当您通过 useCapture 时 - 您会强制在捕获阶段触发事件。 MDN 上的事件阶段 - https://developer.mozilla.org/ru/docs/Web/API/Event/eventPhase
const div = document.getElementById('test');
div.addEventListener('mouseleave',(e) => console.log('out')); // Remove `true`<html>
<body>
<div id='test'>
<ul>
<li>One</li>
<li>Two</li>
<li>Three</li>
<li>Four</li>
</ul>
</div>
</body>
</html>版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。
