查看“Event hover”的源代码

{{DISPLAYTITLE:hover()}}[[Category:jquery ref events|31]]
= jQuery hover() 方法 =

[[jquery ref events|jQuery 事件方法]]

当鼠标指针悬停在上面时，改变 &lt;p&gt; 元素的背景颜色：

<sample title="" desc="" lang="html" hererun="1">
$("p").hover(function(){
    $("p").css("background-color","yellow");
},function(){
    $("p").css("background-color","pink");
});
 </sample>
<run name=""> <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>小白教程(xiaobai.wang)</title>
<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
  $("p").hover(function(){
    $("p").css("background-color","yellow");
    },function(){
    $("p").css("background-color","pink");
  });
});
</script>
</head>
<body>

<p>鼠标移动到该段落。</p>

</body>
</html>
 </run>
== 定义和用法 ==

hover() 方法规定当鼠标指针悬停在被选元素上时要运行的两个函数。

方法触发 [[event mouseenter|mouseenter]] 和 [[event mouseleave|mouseleave]] 事件。

'''注意:''' 如果只指定一个函数，则 mouseenter 和 mouseleave 都执行它。

== 语法 ==

$(selector).hover(inFunction,outFunction)

调用:

<pre>$( selector ).hover( handlerIn, handlerOut )</pre>
等同以下方式：

<pre>
$( selector ).mouseenter( handlerIn ).mouseleave( handlerOut );</pre>
'''注意：'''如果只规定了一个函数，则它将会在 mouseenter 和 mouseleave 事件上运行。

调用:

<pre>$(selector).hover(handlerInOut)</pre>
等同于：

<pre>
$( selector ).on( &quot;mouseenter mouseleave&quot;, handlerInOut );</pre>
{| class="table table-striped table-hover"
! 参数
! 描述
|-
| inFunction
| 必需。规定 mouseenter 事件发生时运行的函数。
|-
| outFunction
| 可选。规定 mouseleave 事件发生时运行的函数。
|}

[[jquery ref events|jQuery 事件方法]]