focus()

このエントリーをはてなブックマークに追加

focus()は要素にフォーカスが当たった際に発火するイベントです。

次のコードでは.targetでフォーカスが当たった際に、その要素の背景色を赤色に変更し、blur()によりフォカースが外れた際に元の色に戻ります。

$(".target").focus(function(){
	$(this).css("background","red");
}).blur(function(){
	$(this).css("border","");
});;

このように、focus()on()のショートカットとして動作します。

また、jQuery 1.4.3よりフォーカスされた際にイベントデータを引き渡すことが可能です。

$(".target").focus("ok",function(e){
	$(this).alert(e.data);
});

この場合、.targetにフォーカスが当たった際にアラートで「ok」が表示されます。

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

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

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

これは、trigger(‘focus’)のショートカットとなります。

jQuery 1.0.0での追加/変更

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

jQuery 1.4.3での追加/変更

jQuery 1.4.3よりイベントデータの引渡しが可能になりました。

参考URL

.focus() | jQuery API Documentation

登録日 : 2013年06月03日 最終更新日 : 2015年10月12日

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

検索

スポンサードリンク

バージョン

リファレンス