默认情况下，hover()方法同时触发mouseenter（）和mouseleave（）事件。
但我们的任务是将hover（）与mouseover（）和mouseout（）一起使用。
我想让“部分”区域在鼠标移转时变成黄色，在鼠标移出时变成灰色。问题是，我的代码只触发mouseover（）事件，我不知道为什么。会有什么问题？
HTML代码
<!DOCTYPE html>
<html>
<head>
<title>Hover</title>
<link rel="stylesheet" href="style_events.css" />
</head>
<section id="one">
<h1>Part One</h1>
<p>yellow is mouseover, gray is mouseout</p>
</section>
<script src="jquery-1.11.0.js"></script>
<script src="hover.js"></script>
</body>
</html>
Jquery代码
$(document).ready(function() {
$("section").hover(
'mouseover', function() {
$("section").css("background-color", "yellow");
},
'mouseout', function() {
$("section").css("background-color", "gray");
});
});
hover()事件已经包含两个事件mouseover和mouseout，您不需要另外指定这两个事件。按顺序指定两个函数就足够了，其中第一个函数作为mouseover，第二个函数作为mouseout。
null
$(document).ready(function () {
$("section").hover(
function () {
$("section").css("background-color", "yellow");
},
function () {
$("section").css("background-color", "gray");
}
);
});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<section id="one">
<h1>Part One</h1>
<p>yellow is mouseover, gray is mouseout</p>
</section>