Exemplu
Executați un JavaScript atunci când un câmp de intrare devine concentreze:
<input type="text"
onfocus="myFunction()"> Încearcă - l singur » Mai multe "Try it Yourself" - "Try it Yourself" exemplele de mai jos.
Definiție și utilizare
Evenimentul onfocus se produce atunci când un element devine concentra.
Evenimentul onfocus este cel mai des folosit cu <input>, <selectați> și <a> .
Tip: Evenimentul onfocus este opusul onblur evenimentului.
Sfat: Evenimentul onfocus este similar cu onfocusin eveniment. Principala diferență este că evenimentul onfocus nu cu bule. Prin urmare, dacă doriți să aflați dacă un element sau copilul său devine punctul central, ai putea folosi evenimentul onfocusin. Cu toate acestea, puteți realiza acest lucru utilizând parametrul useCapture opțional al addEventListener() metoda pentru evenimentul onfocus.
Suport pentru browser-
| Eveniment | |||||
|---|---|---|---|---|---|
| onfocus | da | da | da | da | da |
Sintaxă
In HTML:
< Încearcă - l singur » În JavaScript:
object .onfocus=function(){ Încearcă - l singur » În JavaScript, folosind addEventListener() metoda:
object .addEventListener("focus", myScript );
Încearcă - l singur » Notă: addEventListener() , metoda nu este acceptată în Internet Explorer 8 și versiunile anterioare.
Detalii tehnice
| Bule: | Nu |
|---|---|
| anulabil: | Nu |
| Tip de eveniment: | FocusEvent |
| Tag-uri HTML acceptate: | Toate elementele HTML, cu excepția: <bază>, <BDO>, <br>, <head>, <html>, <iframe>, <meta>, <param>, <script>, <style> și <title> |
| DOM Versiune: | Nivelul 2 Evenimente |
Mai multe exemple
Exemplu
Folosind "onfocus" împreună cu "onblur" eveniment:
<input type="text" onfocus="focusFunction()" onblur="blurFunction()">
Încearcă - l singur » Exemplu
Eveniment delegare: setarea parametrului useCapture de addEventListener() la true:
<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>
Încearcă - l singur » Exemplu
Eveniment delegare: folosind evenimentul focusin (nu este acceptat de Firefox):
<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>
Încearcă - l singur » <Eveniment obiect