Kommentar: Eine einfache HTML -Funktion ermöglicht es uns jetzt, den Eingangsfokus nach dem Laden der Seite automatisch auf die erforderlichen Elemente zu finden. Es wird durch ein Attribut namens Autofokus abgeschlossen. Interessierte Freunde können darüber lernen.
Originaltext: HTML5 Autofocus Attribut
Originalveröffentlichungsdatum: 27. August 2012
Übersetzungszeit: 6. August 2013
HTML5 hat viele großartige Dinge für uns gestartet.
In der Vergangenheit wollten wir JavaScript und Flash, wie z. B. Formularüberprüfung, ein Eingabefeld leere Eingabeaufforderungen (Eingabe -Platzhalter), das Hochladen von Clientdateien und das Herunterladen (Client -Seiten -Datei -Benennung) und Audio-/Video -Wiedergabe, jetzt mit Basic HTML abgeschlossen werden. Eine weitere einfache HTML -Funktion besteht darin, dass wir jetzt den Eingangsfokus nach dem Laden der Seite automatisch auf das erforderliche Element suchen und über eine Eigenschaft namens Autofocus vervollständigen können.
Der Code ist so einfach wie der folgende:
<!- diese alle funktionieren! ->
<Eingabe autofocus = "Autofocus" />
<button autofocus = "autofocus"> hi! </button>
<textarea autofocus = "autofocus"> </textArea>
Nachdem die AutoFocus -Eigenschaft festgelegt wurde, werden die Eingabe-, TextAre- und Schaltflächenelemente automatisch ausgewählt, nachdem die Seite geladen wurde (dh im Fokus). Ich habe andere Elemente (z. B. H1 -Tag), Tabindex = 0, ausprobiert, aber die Autofokuseigenschaft hat überhaupt keine Auswirkungen auf diese Elemente.
Dieses Attribut ist nützlich, um Seiten zu erhalten, deren Hauptzweck darin besteht, Informationen zu sammeln, z. Das Wichtigste ist, dass JavaScript keine Teilnahme erfordert.
Der vollständige Seitencode lautet wie folgt:
<! DocType html>
<html>
<kopf>
<title> HTML5 Autofocus -Attribut -Test </title>
<meta content = "editPlus">
<meta content = "[email protected]">
<meta content = "original = http: //davidwalsh.name/autofocus">
</head>
<body>
<!- Grundsätzlich kann nur eines der folgenden drei Elemente festgelegt werden. Wenn mehrere Elemente festgelegt sind, sollte das letzte Element den Fokus erhalten->
<!-
->
<div>
<Eingabe autofocus = "Autofocus" />
<button autofocus = "autofocus"> hi! </button>
<textarea autofocus = "autofocus"> </textArea>
</div>
</body>
</html>