jQuery mouseover与mouseenter,mouseout与mouseleave的区别

最新推荐文章于 2025-09-12 16:56:45 发布

转载最新推荐文章于 2025-09-12 16:56:45 发布 · 56 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：https://my.oschina.net/u/2391658/blog/691392

文章标签：

#javascript #python #ViewUI

本文详细解释了mouseover与mouseenter、mouseout与mouseleave的区别及应用。通过实例展示了如何使用这些事件改变页面元素的状态。

2019独角兽企业重金招聘Python工程师标准>>>

mouseover与mouseenter

不论鼠标指针穿过被选元素或其子元素，都会触发 mouseover 事件。

只有在鼠标指针穿过被选元素时，才会触发 mouseenter 事件。

mouseout与mouseleave

不论鼠标指针离开被选元素还是任何子元素，都会触发 mouseout 事件。

只有在鼠标指针离开被选元素时，才会触发 mouseleave 事件。

使用方法：

<html>
<head>
<script type="text/javascript" src="/jquery/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
  $("p").mouseenter(function(){
    $("p").css("background-color","yellow");
  });
  $("p").mouseout(function(){
    $("p").css("background-color","red");
  });
});
</script>
</head>
<body>
<p style="background-color:#E9E9E4">请把鼠标指针移动到这个段落上。</p>
</body>
</html>

转载于:https://my.oschina.net/u/2391658/blog/691392