.onblur
現在の要素上にonBlurイベントハンドラが存在すれば、そのコードを返します。また、現在の要素に対してonBlurイベントハンドラの関数を割り当てます。
文法
element.onblur = function;
functionには、()及び引数の付かないユーザー定義関数の名前を、
または下記のように無名関数の定義を指定します。
element.onblur = function() { alert("onblurイベントを検知!"); };
<html>
<head>
<title>onblur event example</title>
<script type="text/javascript">
var elem = null;
function initElement(){
elem = document.getElementById("foo");
// 注意: doEvent();またはdoEvent(param);はここでは動作しません。
// 関数呼び出しではなく、関数名の参照を指定する必要があります。
elem.onblur = doEvent;
};
function doEvent(){
elem.value = 'さようなら';
alert("onblurイベントを検知!")
}
</script>
<style type="text/css">
<!--
#foo {
border: solid blue 2px;
}
-->
</style>
</head>
<body onload="initElement()";>
<form>
<input type="text" id="foo" value="こんにちは!" />
</form>
<p>
上記のinput要素をクリックしてフォーカスを与え、
次に別の外部の要素をクリックしてみてください。<br />
ナビゲーションバーからページの再読み込みを行ってみてください。
</p>
</body>
</html>
例
blurイベントは、要素がフォーカスを失った際に発生します。
ほとんど全ての種類の要素がblurイベントを受け付けるMSIEとは対照的に、 Geckoブラウザのほとんど全ての種類の要素は、このイベントが動作しません。
注意事項
© 2017 Mozilla Contributors
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
このページは、ページトップのURL先のMozilla Developer Network(以下、MDN)のコンテンツを翻訳した内容を基に構成されています。 構成について異なる点も含まれますので、下記の項目を確認し、必要に応じて元のコンテンツをご確認ください。 もし、誤訳などの間違いを見つけましたら、 @tomofまで教えていただければ幸いです。
- 特定のブラウザに特化しすぎている情報やあまりにも古い情報、 または試験的に導入されているようなAPIや機能については、省略していることがあります。
- 例やデモについて、実際にページ内で動作させる関係で一部ソースコードを変更している場合や、 その例で使用しているコンテンツの単語や文章などを日本人向けに変更しいてる場合があります。
- MDNの更新頻度が高いため、元のコンテンツと比べ情報が古くなっている可能性があります。
- "訳注:"などの断わりを入れた上で、日本人向けの情報の追記を行っている事があります。