jQuery リファレンス

Tweet

mouseenter()は要素の内側にマウスカーソルが入った際に発火するイベントです。

JavaScriptのmouseenterイベントはIEのみで利用できるイベントですが、jQueryのイベントは全てのブラウザで利用できます。mouseenter()とmouseover()の違いは、mouseover()はイベントを指定した要素の子要素に乗った際もイベントが発火しますが、mouseenter()は指定した要素に乗った場合のみイベントが発火します。

次のコードでは.targetにマウスカーソルが乗った際にその色を赤色に変更します。

$(".target").mouseenter(function(){
	$(this).css("background","red");
});

また、mouseenter時にイベントデータを引き渡すことが可能です。

$(".target").mouseenter("ok",function(e){
	$(this).text(e.data);
});

この場合.targetにマウスをのせるとテキストが「ok」に変更されます。

引数に何も指定しないことで設定しておいたmouseenterイベントを発火させる事も可能です。

$(".target").mouseenter(function(){
	$(this).css("background","red");
});
$("button").click(function(){
	$(".target").mouseenter();
});

この場合はボタンをクリックした際も.targetのmouseenterイベントが動作します。

mouseenter()はjQuery 1.0で定義されたメソッドです。

jQuery 1.4.3よりイベントデータを扱うことが可能になりました。

参考URL

.mouseenter() | jQuery API Documentation

登録日 : 2013年06月14日 最終更新日 : 2013年6月14日

同じカテゴリー(Events)のエントリー

• change()
• blur()
• unload()
• unbind()
• submit()
• select()
• scroll()
• mouseleave()
• mouseenter()
• keyup()
• keypress()
• keydown()
• focusout()
• focusin()
• focus()
• die()
• delegate()
• dblclick()
• bind()
• undelegate()
• error()
• off()
• resize()
• mouseup()
• mousemove()
• mousedown()
• mouseout()
• mouseover()
• click()
• on()
• load()
• ready()