您的位置:首页 > 其它

mouseover事件与mouseenter事件的区别

2015-03-25 10:31 323 查看
不论鼠标指针穿过被选元素或其子元素,都会触发 mouseover 事件。对应mouseout
只有在鼠标指针穿过被选元素时,才会触发 mouseenter 事件。对应mouseleave

这样的话,mouseenter子元素不会反复触发事件,否则在IE中经常有闪烁情况发生。

<html>

<head>

<script type="text/javascript" src="/jquery/jquery.js"></script>

<script type="text/javascript">

x=0;

y=0;

$(document).ready(function(){

$("div.over").mouseover(function(){

$(".over span").text(x+=1);

});

$("div.enter").mouseenter(function(){

$(".enter span").text(y+=1);

});

});

</script>

</head>

<body>

<p>不论鼠标指针穿过被选元素或其子元素,都会触发 mouseover 事件。</p>

<p>只有在鼠标指针穿过被选元素时,才会触发 mouseenter 事件。</p>

<div class="over" style="background-color:lightgray;padding:20px;width:40%;float:left">

<h2 style="background-color:white;">被触发的 Mouseover 事件:<span></span></h2>

</div>

<div class="enter" style="background-color:lightgray;padding:20px;width:40%;float:right">

<h2 style="background-color:white;">被触发的 Mouseenter 事件:<span></span></h2>

</div>

</body>

</html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: