返回值:jQueryblur(handler(eventObject))

为 JavaScript 的 "blur" 事件绑定一个处理函数,或者触发元素上的该事件。(不支持事件冒泡)

带有参数的该方法是 .bind('blur', handler) 的快捷方式,不带参数的该方法是 .trigger('blur') 的快捷方式。

当一个元素失去焦点时,就会触发 blur 事件。最初,该事件只能应用于表单元素,例如,<input>。但是在最近的浏览器中,该事件的作用域扩大到了所有的元素。元素可以通过键盘命令,如 Tab 键,失去焦点,或通过鼠标点击页面上的其它地方。

举例来说,请看下面的HTML:

<form>
  <input id="target" type="text" value="Field 1" />
  <input type="text" value="Field 2" />
</form>
<div id="other">
  Trigger the handler
</div>
The event handler can be bound to the first input field:
$('#target').blur(function() {
  alert('Handler for .blur() called.');
});

现在,假设第一个表单字段已经获得了焦点,那么,如果点击了页面其它地方或按下了 Tab 键,就会显示如下提示框:

Handler for .blur() called.

也可以通过程序触发此事件,通过调用不带参数的该方法:

$('#other').click(function() {
  $('#target').blur();
});

在代码执行后,如果你点击 Trigger the handler 将同样会弹出上面的消息。

blur 事件在 IE 中不会引发事件冒泡。因此,当脚本依赖于 blur 事件代理时,在跨浏览器的情况下,该脚本可能无法正常工作。然而,从 1.4.2 版本开始,jQuery 通过将 blur 事件映射到 focusout 事件的方法,绕过了这个限制,从而可以在 .live() .delegate() 事件代理中使用该方法,解决了跨浏览器的问题。

示例:

触发所有段落上的 blur 事件:

jQuery 代码:
$("p").blur();