Element: `focusin`-Ereignis
Limited availability
This feature is not Baseline because it does not work in some of the most widely-used browsers.
Das focusin-Ereignis wird ausgelöst, wenn ein Element den Fokus erhält, nach dem focus-Ereignis. Der Unterschied zwischen den beiden Ereignissen besteht darin, dass focusin blasenförmig nach oben wandert (bubbles), während focus dies nicht tut.
Das Gegenteil von focusin ist das focusout-Ereignis, das ausgelöst wird, wenn das Element den Fokus verliert.
Das focusin-Ereignis kann nicht abgebrochen werden.
Syntax
Verwenden Sie den Ereignisnamen in Methoden wie addEventListener().
addEventListener("focusin", (event) => { })
Hinweis:
Es gibt keine onfocusin-Ereignisbehandlungs-Eigenschaft für dieses Ereignis.
Ereignistyp
Ein FocusEvent. Erbt von UIEvent und Event.
Ereigniseigenschaften
Diese Schnittstelle erbt auch Eigenschaften von ihrem übergeordneten UIEvent und indirekt von Event.
-
Das Element, das den Fokus verliert, falls vorhanden.
Beispiele
Live-Beispiel
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 = "";
});
Ergebnis
Spezifikationen
| Specification |
|---|
| UI Events # event-type-focusin |
Hinweis: Die UI Events-Spezifikation beschreibt eine Reihenfolge von Fokus-Ereignissen, die sich von der unterscheidet, die aktuelle Browser implementieren.
Browser-Kompatibilität
Loading…
Siehe auch
- Verwandte Ereignisse:
blur,focus,focusout - Fokussieren: focus/blur