« DOM Reference


The onblur property returns the onBlur event handler code, if any, that exists on the current element.


element.onblur = function;
  • function is the name of a user-defined function, without the () suffix or any parameters, or an anonymous function declaration, such as
element.onblur = function() { alert("onblur event detected!"); };



<title>onblur event example</title>

<script type="text/javascript">

var elem = null;

function initElement()
 elem = document.getElementById("foo");
 // NOTE: doEvent(); or doEvent(param); will NOT work here.
 // Must be a reference to a function name, not a function call.
 elem.onblur = doEvent;

function doEvent()
 elem.value = 'Bye-Bye';
 alert("onblur Event detected!")

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

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

<p>Click on the above element to give it focus, then click outside the
element.<br /> Reload the page from the NavBar.</p>



The blur event is raised when an element loses focus.

In contrast to MSIE--in which almost all kinds of elements receive the blur event--almost all kinds of elements on Gecko browsers do NOT work with this event.


DOM Level 0. Not part of specification.

Document Tags and Contributors

Last updated by: teoli,