blur (evento)

El evento blur es disparado cuando un elemento ha perdido su foco. La diferencia principal entre este evento y focusout es que sólo el último se propaga (bubbles).

Información General

Especificación: DOM L3
Interfaz: FocusEvent (en-US)
Burbujas: No
Cancelable: No
Objetivo: Element
Acción por defecto: Ninguna.

Document.activeElement (en-US)error 452307

null

Propiedades

Propiedad	Tipo	Descripción
`target` Read only	`EventTarget`	Objetivo del evento (elemento DOM)
`type` Read only	`DOMString`	El tipo de evento.
`bubbles` Read only	`Boolean`	Si el elemento normalmente se propaga o no.
`cancelable` Read only	`Boolean`	Si el evento es cancelable o no.
`relatedTarget` Read only	`EventTarget` (DOM element)	null

Hay dos maneras de implementar la delegación de eventos para este evento: usando el evento focusout en exploradores que lo soporten, o cambiando el parámetro "useCapture" de addEventListener a true:

Contenido HTML

<form id="form">
  <input type="text" placeholder="text input">
  <input type="password" placeholder="password">
</form>

Contenido JavaScript

var form = document.getElementById("form");
form.addEventListener("focus", function( event ) {
  event.target.style.background = "pink";
}, true);
form.addEventListener("blur", function( event ) {
  event.target.style.background = "";
}, true);

Compatibilidad en navegadores

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! (en-US)

Escritorio
Móvil

Característica	Chrome	Edge	Firefox (Gecko)	Internet Explorer	Opera	Safari
Soporte básico	5	(Yes)	(Yes)^[1]	6	12.1	5.1

Característica	Android	Chrome para Android	Edge	Firefox Mobile (Gecko)	IE Mobile	Opera Mobile	Safari Mobile
Soporte básico	4.0	53	(Yes)	?	10.0	12.1	5.1

[1] Antes de Gecko 24 (Firefox 24 / Thunderbird 24 / SeaMonkey 2.21) la interfaz para este evento era Event, no FocusEvent (en-US). Vea (error 855741).