Standard-HTML-Formularfokus ohne JavaScript

159

Ist es möglich, den Standardeingabefokus auf ein HTML-Formular ohne Verwendung von JavaScript festzulegen, zum Beispiel:

<html>
  <form>
    Input 1: <input type="text" name="textbox1"/>
    <br/>
    Input 2: <input type="text" name="textbox2"/>
  </form>
</html>

Ich möchte den Standardfokus auf eines der Textfelder setzen, wenn das Formular ohne Verwendung von JavaScript geladen wird (da das Verhalten auftreten soll, wenn ein Benutzer js deaktiviert hat).

html accessibility Adam Jenkin
quelle

Antworten:

292

Sie können dies in HTML5 tun, ansonsten müssen Sie JavaScript verwenden.

Mit HTML5 können Sie autofocusIhrem Formularelement Folgendes hinzufügen , z.

<input type="text" name="myInput" autofocus />

Dies funktioniert in Browsern, die HTML5 unterstützen (oder besser gesagt in Browsern, die diesen bestimmten Teil von HTML5 unterstützen), aber wie Sie wissen, kann es noch nicht jeder verwenden.

Jake Lucas
quelle
22

Beachten Sie Folgendes: Wenn Sie ein fokussiertes Formularelement festlegen, muss jeder, der Assisted Technology (AT) wie einen Bildschirmleser verwendet, eine Sicherungskopie erstellen, um Menüs und andere Inhalte anzuzeigen, die sich vor dem fokussierten Feld befinden.

Eine bevorzugte Methode ist meiner Meinung nach, keinen Fokus auf ein Feld zu legen, außer auf einen Sprunglink, falls verfügbar. Dadurch haben sie die Möglichkeit, in den Seiteninhalt zu springen oder die Seite von oben nach unten zu lesen.

Greg
quelle
Es wäre großartig, einen Skip-Link hinzuzufügen, der auch visuell verborgen ist, aber über Screenreader zugänglich ist!
James Cazzetta
Ich muss so viel über Barrierefreiheit lernen. Vielen Dank, dass Sie diese Antwort hinzugefügt haben, damit der Rest von uns lernen kann!
Andrew Steitz
3

Wie andere bereits gesagt haben, können Sie ohne Javascript kein Standardfeld garantieren. Eine alternative Option, die Sie möglicherweise ausprobieren möchten, wenn Sie mehrere Felder haben, auf die ein Benutzer möglicherweise zugreifen möchte, ist die Verwendung vonaccesskey Attributs. Dies bedeutet im Wesentlichen, dass ein Benutzer sofort während des Surfens zu einem der Felder zurückkehren kann, was für Benutzer von Bildschirmleseprogrammen usw. nützlich sein kann.

Wikipedias Artikel zu diesem Thema ist sehr nützlich - http://en.wikipedia.org/wiki/Access_key


quelle
0

Dies ist ohne irgendeine Form von Skripten nicht möglich. Selbst auf der Google-Startseite muss Javascript das Suchfeld fokussieren.

Evan Mulawski
quelle
1
Es ist. Google fügt nur Javascript für Browser hinzu, die HTML5 nicht unterstützen. In jeder App eine Überlegung wert.
MVRAKEL
-8

Möglicherweise können Sie das tabindex- Attribut verwenden und jedoch den niedrigsten Wert für das Standardtextfeld verwenden. Überprüfen Sie hier die Browserunterstützung:

http://reference.sitepoint.com/html/object/tabindex#compatibilitysection

Die Seite schlägt das vor

(In fast allen anderen Fällen - nämlich bei Formularsteuerelementen und Links - bietet der Tabindex eine hervorragende Unterstützung.)

Cahit
quelle
3
Das Attribut "tabindex" gibt keinen automatischen Fokus auf Elemente, auch nicht auf ein Element mit "tabindex = 1". Durch Drücken der Tabulatortaste (oder eines Klicks) wird das erste Element in der Tabulatorsequenz fokussiert.
Clint Pachl