[jQuery] フォームでマウスのフォーカスイン・アウトを判断する方法
マウスの動作によって処理を分岐させる方法です。
今回はインプットボックスにマウスがフォーカスイン・アウトした場合の処理を作成してみます。
フォーカスイン・アウトの実例
jQuery
|
1 2 3 4 5 6 7 8 9 10 11 |
<script type="text/javascript"> $(function () { $('#sample input').focus(function (e) { $(this).val('フォーカスされました。'); }).blur(function (e) { $(this).val('フォーカスされなくなりました。'); }); }); </script> |
書式
jQuery( 対象要素 ).focus( [ eventData ], handler )
jQuery( 対象要素 ).blur( [ eventData ], handler )
jQuery( 対象要素 ).blur( [ eventData ], handler )
XHTML
|
1 2 3 4 5 |
<form action="#"> <div id="sample" title=""> <input type="text" value="マウスでフォーカスしてみてください。" size="50" /> </div> </form> |
Demo
テキストボックスにマウスを移動してみてください。テキストボックスの中の文字が変化します。
関連記事
- [jQuery] 子ウィンドウのチェックボックスの値を親ウィンドウに渡す方法
- [jQuery] 背景の色を変更する方法
- [jQuery] JavaScriptで全角英数を半角英数に変換する方法
- [jQuery] FormでPOST/GETの内容をたった一行で取得する方法
- [jQuery] eachでリストの要素数を数える
