Wie letzte Woche bereits angekündigt geht es Heute mit dem nächsten HTML5 Attribut weiter: „autofocus„. Das ist eines dieser Attribute, das uns Javascript ersparen kann…

Das autofocus Attribut

Heute kann ich leider nicht so viel schreiben wie letzte Woche – Das autofocus Attribut ist sehr schnell erklärt und bringt keinerlei zusätzliche Funktionen mit. Der „Autofocus“ bewirkt, das der Fokus beim laden der Seite direkt auf diesem Feld liegt und man lostippen kann – das ist bei Login-Seiten z.B. sehr Sinnvoll!
Es können übrigens auch mehrere autofocus-Felder pro Seite existieren – Dabei wird dann lediglich der Fokus auf das erste Feld gelegt.

Um es kurz zu machen

In der Praxis muss der ganze Spaß in etwa so aussehen:

<form action="index.php">
   <input type="text" id="demofeld" name="demofeld" autofocus>
</form>

Die Javascript Alternative

Und für alte Browser und diejenigen, die kein HTML5 unterstützen gibt es noch immer Javascript – Inklusive des Checks auf Kompatibilität (Sehr ähnlich dem Check für „download“):

var inp = document.createElement('input');

if (typeof inp.autofocus == 'undefined') {
   // jQuery
   $('#demofeld').focus();

   // Prototype
   $('demofeld').focus();
}

Und das war es leider auch schon wieder… Ihr kennt nun alle Geheimnisse des autofocus Attributes 😉 Ich hoffe das ich nächste Woche etwas mehr zusammentragen kann – Die Auswahl ist ja groß genug! Bis dahin wünsche ich euch eine angenehme Woche und einen ruhigen Feiertag.