Autofocus in Formularen mithilfe von HTML erstellen.

28. März, 2016
Crosshair 2 von iconmonstr.

Manchmal möchte man, dass ein Formular nach dem Laden der Seite automatisch aktiv wird. Das bedeutet, sobald die Seite mit dem Formular geladen wurde, wird das Formular-Feld aktiviert und man kann sofort tippen.

Z. B. wollte ich das gerne auf meiner Suchseite haben.

So muss man nicht zuerst noch auf das Such-Feld klicken. Dieses Feld ist schon aktiv und man kann das Suchwort sofort ohne einen Klick eintippen.

Mit HTML geht das ganz einfach

In dein Formular musst du das Attribut autofocus einfügen. Hier ist ein Beispiel für dich:

Aus dem folgenden Code:

<input type="text">

Machst du diesen draus:

<input autofocus type="text">

Und schon ist die Sache erledigt.

Allerdings muss ich dazu sagen, dass es nur mit HTML5-fähigen Browser geht. Aber da die meisten modernen Browser sowieso HTML5 verarbeiten können, ist es eigentlich nicht der Rede wert.

Hier kannst du sehen, welche Browser ab welcher Version diesen Attributen verarbeiten können.

Für alle Browser, die nicht HTML5-fähig sind, gibt es noch eine Javascript-Lösung.

Hinterlasse einen Kommentar