jQuery フォーム イベント focus() および Blur() イベント
focus() イベント
定義と使用法
focus イベントは、要素がフォーカスを取得したときに発生します。
マウスをクリックして要素を選択するか、タブキーで配置すると、その要素にフォーカスが置かれます。
focus() メソッドは、フォーカス イベントをトリガーするか、フォーカス イベントの発生時に実行する関數(shù)を指定します。
blur() イベント
定義と使用法
Blur イベントは、要素がフォーカスを失ったときに発生します。
blur() 関數(shù)はブラー イベントをトリガーします。関數(shù)パラメーターが設(shè)定されている場合、関數(shù)はブラー イベントの発生時に実行されるコードを指定することもできます。
ヒント: 以前は、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>テキスト ボックスをクリックすると、テキスト ボックスにフォーカスが設(shè)定され、背景色が赤に変わります
テキスト ボックスの外側(cè)をクリックすると、テキスト ボックスはフォーカスを失い、緑に変わります
