jQuery hover()滑鼠移入移出事件

從之前的學習中我們知道，滑鼠（指標）移入和滑鼠（指標）移出這兩個事件往往都是配合起來使用的，而我們需要分別對這兩個事件定義。為了簡化程式碼，jQuery 為我們提供了 hover() 方法來一次性定義這兩個事件，這就是所謂的“合成事件”。

語法：

$().hover(fn1, fn2)

引數 fn1 表示滑鼠（指標）移入事件觸發的處理常式，引數 fn2 表示滑鼠（指標）移出事件觸發的處理常式。

舉例

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
    <script src="js/jquery-1.12.4.min.js"></script>
    <script>
        $(function () {
            $("div").hover(function(){
                $(this).css("color", "red");
            },function(){
                $(this).css("color", "black");
            })
        })
    </script>
</head>
<body>
    <div>C語言中文網，給你初戀般的感覺。</div>
</body>
</html>

預覽效果如圖 1 所示。

圖 1:合成事件