Eingabeattribute

Das HTML-<input>-Element ermöglicht es uns, verschiedene Formularelemente zur Erfassung von Benutzereingaben zu erstellen. Sie können das Verhalten und das Erscheinungsbild dieser Elemente mit verschiedenen Attributen anpassen. Lassen Sie uns einige häufig verwendete Attribute erkunden:

value

Das value-Attribut wird verwendet, um den Anfangswert des <input>-Elements festzulegen. Der spezifische Wert hängt vom Eingabetyp ab:

• Für Schaltflächen (type="button", type="reset", type="submit") definiert es den auf der Schaltfläche angezeigten Text;
• Für Textfelder (type="text") und Passwortfelder (type="password") definiert es den Standardwert des Eingabefelds;
• Für Kontrollkästchen (type="checkbox") und Optionsfelder (type="radio") definiert es den mit der Eingabe verbundenen Wert.

Hinweis

Das value-Attribut kann nicht mit <input type="file"> verwendet werden.

autofocus

Das autofocus-Attribut gibt an, dass das Eingabefeld automatisch den Fokus haben soll, wenn die Webseite geladen wird. Beim Laden der Seite wird das Eingabefeld automatisch ausgewählt, sodass der Benutzer ohne vorheriges Klicken auf das Eingabefeld mit der Eingabe beginnen kann.

Hinweis

Autofocus funktioniert hier nicht, da die Seite nicht neu geladen wird, wenn Sie auf die Schaltfläche "Code ausführen" klicken.

required

Das required-Attribut wird verwendet, um ein Eingabefeld obligatorisch zu machen. Es gibt an, dass das Eingabefeld ausgefüllt werden muss, bevor der Benutzer das Formular absenden kann. Wenn der Benutzer versucht, das Formular abzusenden, ohne das erforderliche Eingabefeld auszufüllen, erhält er eine Validierungsfehlermeldung, die darauf hinweist, dass das Feld erforderlich ist.

Platzhalter

Das placeholder-Attribut bietet dem Benutzer einen Hinweis oder ein Beispiel für den erwarteten Eingabewert. Ein kurzer Text wird im Eingabefeld angezeigt, bevor der Benutzer einen Wert eingibt. Dies ist nützlich für Felder, die eine spezifische Formatierung erfordern, wie z.B. Telefon- oder Kreditkartennummern.

Hinweis

In den obigen Beispielen werden verschiedene type-Attribute für die <input>-Elemente verwendet, die ihr Erscheinungsbild und ihre Funktionalität erheblich beeinflussen. Sie werden im nächsten Kapitel tiefer in die verschiedenen Eingabetypen eintauchen.