サイト制作に関するメモ書き

HOME > JavaScript > jQuery > jQueryのon()で複数のイベントを設定する

jQueryのon()で複数のイベントを設定する

jQueryのon()でhover()を使いたいことがたまにあるので、実装方法をメモしておきます。

サンプルコード

hover()はmouseenterイベントとmouseleaveイベントで設定します。

HTML

<a href="" class="hover-element">consoleに結果を表示します。</a>

同一の要素に複数のイベントを設定したい場合、以下のように設定します。

JavaScript

$(function() {
	$('.hover-element').on({
		mouseenter: function() {
			console.log('mouseenter');
		}, mouseleave: function() {
			console.log('mouseleave');
		}
	});
});

mouseenterとmouseleaveのデモページ
 

【参考サイト】

 

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

▲PAGE TOP