blur (event)
Событие blur
вызывается когда элемент теряет фокус. Главное отличие между этим событием и focusout
только в том что у последнего есть фаза всплытия.
Основная информация
- Спецификация
- DOM L3
- Интерфейс
FocusEvent
(en-US)- Всплытие
- Нет
- Отменяемый
- Нет
- Цель
- Элемент
- Действие по умолчанию
- Нет
Свойства
Property | Type | Description |
---|---|---|
target Только для чтения |
EventTarget |
Event target (DOM element) |
type Только для чтения |
DOMString |
The type of event. |
bubbles Только для чтения |
Boolean |
Whether the event normally bubbles or not. |
cancelable Только для чтения |
Boolean |
Whether the event is cancellable or not. |
relatedTarget Только для чтения |
EventTarget (DOM element) |
null |
Делегирование события
Есть два способа реализовать делегирование этого события: использовать событие focusout
в браузерах которые поддерживают его (все браузеры, Firefox с 52+), или установить параметр "useCapture" метода addEventListener
на true
:
HTML Content
<form id="form">
<input type="text" placeholder="text input">
<input type="password" placeholder="password">
</form>
JavaScript Content
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);
Совместимость с браузерами
BCD tables only load in the browser