We're looking for a user researcher to understand the needs of developers and designers. Is this you or someone you know? Check out the post: https://mzl.la/2IGzdXS

onblur プロパティは blur イベントのオブジェクトのイベントハンドラーを表します。ElementDocumentWindow で利用できます。


element.onblur = function;
  • function は、接尾辞 () や引数のないユーザーが定義関数、または無名関数で宣言された関数です。例えば、以下のように使われます。
element.onblur = function() { alert("onblur event detected!"); };


<title>onblur イベントコード例</title>

<script type="text/javascript">

var elem = null;

function initElement()
 elem = document.getElementById("foo");
 // NOTE: doEvent(); または doEvent(param); はここでは動作しません
 // 関数呼び出しではなく、関数の名前を参照する必要があります。
 elem.onblur = doEvent;

function doEvent()
 elem.value = 'Bye-Bye';
 alert("onblur イベントが検出されました!")

<style type="text/css">
#foo {
border: solid blue 2px;

<body onload="initElement();">
<input type="text" id="foo" value="Hello!" />

<p>上記の要素をクリックして focus イベントを付与してください。その次に、要素の範囲外をクリックしてください。<br /> ナビゲーションバーからページをリロードしてください。</p>



blur イベントは要素が focus イベントを失った時に発生されます。

ほとんどの HTML要素が blur イベントを受け取る MSIE--in と対照的に、Gecko ブラウザーではほぼすべての要素で blur イベントは発生しません。


仕様書 策定状況 コメント
HTML Living Standard
onblur の定義

Browser Compatibility

We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help!

機能 Chrome Edge Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
基本サポート (有) (有) ? ? ? ?
機能 Android Android Webview Chrome for Android Edge Firefox Mobile (Gecko) Firefox OS IE Mobile Opera Mobile Safari Mobile
基本サポート ? ? ? ? ? ? ? ? ?


このページの貢献者: Uemmra3, Kenju
最終更新者: Uemmra3,