mouseout和mouseleave的区别？
我看两个事件都是鼠标移出执行什么什么操作啊，有什么不同啊？什么时候用哪个啊？
2 回答
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>jQuery基础修炼圣典—事件篇</title>
<script src="https://cdn.bootcss.com/jquery/3.0.0/jquery.min.js"></script>
<style>
li{
padding: 10px;
margin-bottom: 4px;
background: rgba(0,0,255,.3);
}
li span{display:none;background: yellow}
</style>
</head>
<body>
<ul>
<li>只有开被选<span>span</span></li>
<li>在鼠标指针离<span>span</span></li>
<li>元素时，才<span>span</span></li>
<li>会触发 mous<span>span</span></li>
<li>eleave 事件。<span>span</span></li>
</ul>
<script>
$(function(){
$("li").each(function(i) {
//删除的鼠标划过的显示与隐藏
$(this).mouseover(function() {
$(this).find(".del").fadeIn(100);
})
$(this).mouseout(function() {
$(this).find(".del").fadeOut(100);
})
})
})
</script>
</body>
</html>以上一个例子,你可以修改mouseout为mouseleave看看
当为mouseout的时候，你会发现在li内部鼠标移到.del的时候.del会闪动，那是因为你可能离开了该DIV的子元素，所以会出发mouseout事件。而mouseleave没有这个问题。
具体mouseleave和mouseout两者之间的区别主要有以下两点：
1.不论鼠标指针离开被选元素还是任何子元素，都会触发 mouseout 事件。
2.只有在鼠标指针离开被选元素时，才会触发 mouseleave 事件。
举报
0/150
提交
取消
