Neueste Web-Entwicklung Tutorials
 

onfocusin Ereignis

<Ereignisobjekt

Beispiel

Führen Sie einen JavaScript, wenn ein Eingabefeld ist etwa Fokus zu erhalten:

<input type="text" onfocusin="myFunction()">
Versuch es selber "

Mehr "Try it Yourself" Sie "Try it Yourself" Beispiele unten.

Definition und Verwendung

Das onfocusin Ereignis tritt auf, wenn ein Element im Begriff ist, Fokus zu erhalten.

Tipp: Das onfocusin Ereignis ähnelt dem onfocus - Ereignis. Der wesentliche Unterschied besteht darin, dass das onfocus-Ereignis nicht Blase. Deshalb, wenn Sie ein Element oder sein Kind herausfinden wollen, ob den Fokus erhält, sollten Sie das onfocusin Ereignis verwenden.

Tipp: Auch wenn Firefox nicht die onfocusin Veranstaltung unterstützen, können Sie herausfinden , ob ein Kind eines Elements den Fokus erhält oder nicht, durch einen Fang Listener für die Verwendung von onfocus - Ereignis (das optionale Parameter useCapture der mit addEventListener() Methode).

Tip: Das onfocusin Ereignis ist das Gegenteil von dem onfocusout Ereignisse.

Browser-Unterstützung

Event
onfocusin Ja Ja Nicht unterstützt Ja Ja

Hinweis: Das onfocusin Ereignis möglicherweise nicht funktionieren wie erwartet in Chrome, Safari und Opera 15+ die JavaScript - HTML - DOM - Syntax. Es sollte jedoch als HTML - Attribut arbeiten und durch die Verwendung von addEventListener() Methode.

Syntax

In HTML:

< Versuch es selber "

In JavaScript (may not work as expected in Chrome, Safari and Opera 15+) :

object .onfocusin=function(){ Versuch es selber "

In JavaScript mit den addEventListener() Methode:

object .addEventListener("focusin", myScript );
Versuch es selber "

Hinweis: Die addEventListener() Methode wird nicht unterstützt in Internet Explorer 8 und früheren Versionen.

Technische Details

Blasen: Ja
Es fällt eine Pauschale: Nein
Event-Typ: Focus
Unterstützte HTML-Tags: Alle HTML - Elemente, AUSSER: <base>, <bdo>, in , <head>, <html>, <iframe>, <meta>, <param>, <script>, <style> und <title>
DOM Version: Level 2 Veranstaltungen
Beispiele

Mehr Beispiele

Beispiel

Mit "onfocusin" zusammen mit dem "onfocusout" Event:

<input type="text" onfocusin="focusFunction()" onfocusout="blurFunction()">
Versuch es selber "

Beispiel

Ereignis Delegation: die useCapture Parameter der Einstellung addEventListener() auf true (for focus and blur) :

<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>
Versuch es selber "

Beispiel

Event-Delegation: das focusin Ereignis (nicht von Firefox unterstützt):

<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>
Versuch es selber "
<Ereignisobjekt