Heim > Artikel > Web-Frontend > HTML5-Übungs- und Analyseformular – Erhalten Sie automatisch das Fokusattribut (Autofokusattribut)
HTML5 hat dem Formular viele neue Funktionen hinzugefügt. Heute werde ich Ihnen die neu hinzugefügten Fokusattribute im HTML5-Formular vorstellen.
HTML5 fügt das Autofokus-Attribut hinzu. In Browsern, die es unterstützen, kann der Fokus automatisch auf das entsprechende Feld verschoben werden, ohne JavaScript zu verwenden, um den Fokus dynamisch zu erhalten. Ein kleines Beispiel lautet wie folgt:
HTML-Code
<input type="text" value="梦龙小站" autofocus />
Vorschaueffekt
Um sicherzustellen, dass der obige Code normal ausgeführt wird In dem Browser, in dem der Autofokus eingestellt ist, müssen wir erkennen, ob dieses Attribut in JavaScript festgelegt ist. Wenn festgelegt, ist es nicht erforderlich, die Methode focus() aufzurufen.
JavaScript-Code
function load(){ var oInp = document.getElementById("inp"); if(oInp.autofocus != true){ oInp.focus(); } } window.addEventListener('load',load, false);
HTML-Code
<input type="text" value="梦龙小站" autofocus />
Vorschaueffekt
Da Autofokus ein boolesches Attribut ist, ist sein Wert in unterstützten Browsern „true“ und in nicht unterstützten Browsern ein leerer String. Der obige Code ruft die Methode focus() nur auf, wenn der Autofokus ungleich „true“ ist, wodurch die Vorwärtskompatibilität sichergestellt wird. Zu den Browsern, die das Autofokus-Attribut unterstützen, gehören Firefox 4+, Safari 5+, Chrome und Opera 9.6.
Standardmäßig können nur Formulare den Fokus erhalten. Wenn Sie bei anderen Beschriftungselementen zuerst deren tabIndex-Attribut auf -1 setzen und dann die Methode focus() aufrufen, können diese Elemente ebenfalls fokussiert werden, aber nur Opera unterstützt diese Technologie nicht.
HTML5 macht das Programmierleben wirklich sehr einfach. Ein kleines Attribut spart eine oder sogar mehrere Zeilen JavaScript-Code und macht das Programmierleben für jeden einfacher und komfortabler. Damit ist die Einführung in das HTML5-Praxis- und Analyseformular abgeschlossen – das automatische Erhalten des Fokusattributs (Autofokusattribut) wird hoffentlich für alle in HTML5-Anwendungen hilfreich sein.
Das Obige ist das eigentliche HTML5-Kampf- und Analyseformular – der Inhalt des automatischen Erhaltens des Fokusattributs (Autofokusattribut). Weitere verwandte Inhalte finden Sie auf der chinesischen PHP-Website (www.php.cn). !