Przykład
Wykonać JavaScript, gdy pole wejściowe uzyskuje fokus:
<input type="text"
onfocus="myFunction()">
Spróbuj sam " Więcej "Try it Yourself" przykłady poniżej.
Definicja i Wykorzystanie
Impreza onfocus występuje, gdy element staje się skupić.
Impreza onfocus jest najczęściej używany z <input>, <Wybierz>, a <a> .
Tip: Impreza onfocus jest przeciwieństwem onblur imprezy.
Wskazówka: onfocus zdarzenie jest podobny do onfocusin imprezy. Główną różnicą jest to, że zdarzenie onfocus nie bańkę. Dlatego, jeśli chcesz dowiedzieć się, czy element lub jego dziecko dostaje ostrość, można użyć onfocusin wydarzenie. Jednak można to osiągnąć za pomocą opcjonalnego parametru użyj przechwytu na addEventListener() metoda przypadku onfocus.
Wsparcie przeglądarka
Zdarzenie | |||||
---|---|---|---|---|---|
onfocus | tak | tak | tak | tak | tak |
Składnia
W HTML:
W JavaScript:
object .onfocus=function(){ Spróbuj sam "
W JavaScript, używając addEventListener() metodę:
object .addEventListener("focus", myScript );
Spróbuj sam " Uwaga: addEventListener() metoda ta nie jest obsługiwana w programie Internet Explorer 8 i wcześniejszych wersjach.
Szczegóły techniczne
bubbles: | Nie |
---|---|
opłata: | Nie |
Typ wydarzenia: | FocusEvent |
Obsługiwane znaczniki HTML: | Wszystkie elementy HTML, z wyjątkiem: <baza>, <BDO>, Największa, <head>, <html>, <iframe>, <meta>, <param> <script> <style> i <title> |
DOM wersja: | Poziom 2 Wydarzenia |
Więcej przykładów
Przykład
Używanie "onfocus" razem z "onblur" imprezy:
<input type="text" onfocus="focusFunction()" onblur="blurFunction()">
Spróbuj sam " Przykład
Delegacja zdarzenia: ustawienie parametru użyj przechwytu z addEventListener() 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>
Spróbuj sam " Przykład
delegacja zdarzenia: za pomocą zdarzenia focusIn (nie obsługiwane przez Firefoksa):
<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>
Spróbuj sam " <Object Event