focus() イベント
定義と使用法
focus イベントは、要素がフォーカスを取得したときに発生します。
マウスをクリックして要素を選択するか、タブキーで配置すると、その要素にフォーカスが置かれます。
focus() メソッドは、フォーカス イベントをトリガーするか、フォーカス イベントの発生時に実行する関数を指定します。
blur() イベント
定義と使用法
Blur イベントは、要素がフォーカスを失ったときに発生します。
blur() 関数はブラー イベントをトリガーします。関数パラメーターが設定されている場合、関数はブラー イベントの発生時に実行されるコードを指定することもできます。
ヒント: 以前は、blur イベントはフォーム要素でのみ発生しました。新しいブラウザでは、このイベントは任意の要素で使用できます。
以下の例を見てみましょう:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script> </head> <body> 请输入:<input type="text"> <script> $('input').focus(function(){ $('input').css('background',"red"); }) $('input').blur(function(){ $('input').css('background',"green"); }) </script> </body> </html>
テキスト ボックスをクリックすると、テキスト ボックスにフォーカスが設定され、背景色が赤に変わります
テキスト ボックスの外側をクリックすると、テキスト ボックスはフォーカスを失い、緑に変わります