Heim > Web-Frontend > H5-Tutorial > HTML5-Übungs- und Analyseformular – Erhalten Sie automatisch das Fokusattribut (Autofokusattribut)

HTML5-Übungs- und Analyseformular – Erhalten Sie automatisch das Fokusattribut (Autofokusattribut)

黄舟
Freigeben: 2017-02-11 11:29:40
Original
3002 Leute haben es durchsucht


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 />
Nach dem Login kopieren

 Vorschaueffekt


HTML5-Übungs- und Analyseformular – Erhalten Sie automatisch das Fokusattribut (Autofokusattribut)

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(&#39;load&#39;,load, false);
Nach dem Login kopieren

 HTML-Code

<input type="text" value="梦龙小站" autofocus />
Nach dem Login kopieren

 Vorschaueffekt

HTML5-Übungs- und Analyseformular – Erhalten Sie automatisch das Fokusattribut (Autofokusattribut)

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 (m.sbmmt.com). !




Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage