点击事件会影响chrome上的mouseenter和mouseleave，是一个bug吗？
点击事件会影响chrome上的mouseenter和mouseleave，是一个bug吗？
提问于 2017-12-05 16:49:04
添加mouseenter和mouseleave事件后，点击该元素(点击次数不确定)，将触发mouseenter和mouseleave。
我尝试了chrome 62.0.3202.94(32)，firework，IE，它只在chrome.Is上发生，是chrome的bug，还是我的代码有问题？
在线示例：http://runjs.cn/code/cbb0aw1a
代码如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<h4>click on the parent part,then see the console </h4>
<div class="parent" style="width: 100%;height: 100px;background-color: #ddd">
<div class="children" style="width: 50px;height: 50px;background-color: #d9534f;cursor: pointer">
test
</div>
</div>
</body>
<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.js"></script>
<script>
$(".parent").mouseenter(function () {
console.log("enter")
}).mouseleave(function () {
console.log("leave")
});
</script>
</html>回答 1
Stack Overflow用户
发布于 2017-12-09 00:07:00
我可以确认chrome (版本62.0.3202.94)上的行为。
当多次单击一个元素时，偶尔会在MouseEvent (screenX，screenY属性均为0)上触发mouseleave，并将relatedTarget/toElement属性设置为"null“。
这种行为是随机的，有时需要2次后续点击，有时超过20次。点击速度/速率似乎也无关紧要。
到目前为止，我通过检查事件的relatedTarget属性来避免在我的onMouseLeave(事件)方法中执行不需要的代码(如果"null“什么也不做)。不知道是否存在另一种有用的情况，即relatedTarget可能为null...
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/47649442
复制相关文章
相似问题