Element: focusout event
Limited availability
This feature is not Baseline because it does not work in some of the most widely-used browsers.
Thuộc tính focusout fires when an element has lost focus, after the blur event. The two events differ in that focusout bubbles, while blur does not.
The opposite of focusout is the focusin event, which fires when the element has received focus.
The focusout event is not cancelable.
Cú pháp
Use the event name in methods like addEventListener(), or set an event handler property.
addEventListener("focusout", (event) => { })
onfocusout = (event) => { }
Event type
Một FocusEvent. Inherits from UIEvent and Event.
Event properties
This interface also inherits properties from its parent UIEvent, and indirectly from Event.
-
The element receiving focus, if any.
Ví dụ
Live example
HTML
<form id="form">
<label>
Some text:
<input type="text" placeholder="text input" />
</label>
<label>
Password:
<input type="password" placeholder="password" />
</label>
</form>
JavaScript
const form = document.getElementById("form");
form.addEventListener("focusin", (event) => {
event.target.style.background = "pink";
});
form.addEventListener("focusout", (event) => {
event.target.style.background = "";
});
Result
Đặc tả kỹ thuật
| Specification |
|---|
| UI Events # event-type-focusout |
Note: The UI Events specification describes an order of focus events that's different from what current browsers implement.
Trình duyệt hỗ trợ
Xem thêm
- Related events:
blur,focus,focusin - Focusing: focus/blur