onfocusout událost
Příklad
Spusťte JavaScript, když vstupní pole ztratí pozornost:
<input type="text"
onfocusout="myFunction()">
Další příklady „Vyzkoušejte si to sami“ níže.
Definice a použití
K události onfocusout dochází, když prvek ztratí pozornost.
Tip: Událost onfocusout je podobná události onblur . Hlavní rozdíl je v tom, že událost onblur nebublá. Pokud tedy chcete zjistit, zda prvek nebo jeho potomek ztratí fokus, měli byste použít událost onfocusout.
Tip: Událost onfocusout je opakem události onfocusin .
Podpora prohlížeče
Čísla v tabulce určují první verzi prohlížeče, která událost plně podporuje.
| Event | |||||
|---|---|---|---|---|---|
| onfocusout | Yes | Yes | 52.0 | Yes | Yes |
Poznámka: Událost onfocusout nemusí fungovat podle očekávání v prohlížečích Chrome, Safari a Opera 15+ používající syntaxi JavaScript HTML DOM. Měl by však fungovat jako atribut HTML a pomocí metody addEventListener() (viz příklady syntaxe níže).
Syntax
V HTML:
<element onfocusout="myScript">
V JavaScriptu (nemusí fungovat podle očekávání v prohlížečích Chrome, Safari a Opera 15+):
object.onfocusout = function(){myScript};
V JavaScriptu pomocí metody addEventListener():
object.addEventListener("focusout", myScript);
Poznámka: Metoda addEventListener() není podporována v aplikaci Internet Explorer 8 a starších verzích.
Technické údaje
| bubliny: | Ano |
|---|---|
| Zrušitelné: | Ne |
| Typ události: | FocusEvent |
| Podporované HTML tagy: | VŠECHNY prvky HTML, KROMĚ: <base>, <bdo>, <br>, <head>, <html>, <iframe>, <meta>, <param>, <script>, <style> a <title> |
| Verze DOM: | Události úrovně 2 |
Další příklady
Příklad
Použití „onfocusin“ společně s událostí „onfocusout“:
<input type="text" onfocusin="focusFunction()" onfocusout="blurFunction()">
Příklad
Delegování události: nastavení parametru useCapture funkce addEventListener() na hodnotu true (pro zaměření a rozmazání):
<form id="myForm">
<input type="text" id="myInput">
</form>
<script>
var x = document.getElementById("myForm");
x.addEventListener("focus", myFocusFunction, true);
x.addEventListener("blur", myBlurFunction, true);
function myFocusFunction() {
document.getElementById("myInput").style.backgroundColor = "yellow";
}
function myBlurFunction() {
document.getElementById("myInput").style.backgroundColor = "";
}
</script>
Příklad
Delegování události: pomocí události focusin:
<form id="myForm">
<input type="text" id="myInput">
</form>
<script>
var x = document.getElementById("myForm");
x.addEventListener("focusin", myFocusFunction);
x.addEventListener("focusout", myBlurFunction);
function myFocusFunction() {
document.getElementById("myInput").style.backgroundColor = "yellow";
}
function myBlurFunction() {
document.getElementById("myInput").style.backgroundColor = "";
}
</script>