jQuery $（document）.on（....？）で複数の関数を呼び出すことができますか.........

Question

これは機能しますか？これはちょうど.hover()関数で行うことができますが、 。AJAXと

Codepen

$(document).on('mouseenter', '.result', 
 
    function() { 
 
    $(this).addClass("result_hover"); 
 
    }, 
 
    function() { 
 
    $(this).removeClass("result_hover"); 
 
    } 
 
);

.result_hover { 
 
    color: red; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<h1 class="result"> 
 
    Result 
 
</h1>

Answer 1

jQuery.hoverに記載されているように：

.hover（）メソッドは、mouseenterイベントとmouseleaveイベントの両方のハンドラをバインドします。

1つのハンドラにのみ興味がある場合は、toggleClass(className, state)を使用できます。

だから、あなたが行うことができます：

$(document).on('mouseenter mouseleave', '.result', function(e) { 
 
    $(this).toggleClass("result_hover", e.type == 'mouseenter'); 
 
});

.result_hover { 
 
    color: red; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 

 
<h1 class="result"> 
 
    Result 
 
</h1>