HTML-Eingabeattribute für Erweiterte Funktionalität
Wir wissen bereits, wie man Formulare mit Eingabefeldern und Beschriftungen erstellt. Nun betrachten wir weitere nützliche Attribute für Eingabeelemente, die deren Funktionalität und Benutzerfreundlichkeit verbessern.
Allgemeine Attribute für Eingabeelemente
Platzhalter
placeholder bietet einen Hinweis oder Beispieltext innerhalb des Eingabefelds und gibt Nutzern eine Orientierung, welche Art von Eingabe erwartet wird. Nützlich zur Bereitstellung von Kontext oder Anweisungen, bevor Daten eingegeben werden.
<input type="text" placeholder="Enter your email" />
Name
name legt den Namen des Eingabefelds fest, der zur Identifizierung der Eingabedaten beim Absenden des Formulars verwendet wird. Jedes Eingabefeld innerhalb eines Formulars sollte ein eindeutiges name-Attribut besitzen.
<input type="text" name="username" />
Wert
value setzt den Anfangs- oder Standardwert des Eingabefelds. Das Eingabefeld wird beim Laden der Seite mit einem bestimmten Wert vorausgefüllt.
<input type="tel" value="+1 (484) 298-9732" />
Erforderlich
required gibt an, dass das Eingabefeld ausgefüllt werden muss, bevor das Formular abgeschickt werden kann. Verhindert das Absenden des Formulars, wenn das erforderliche Feld leer bleibt.
<input type="password" required />
Deaktiviert
disabled deaktiviert das Eingabefeld und verhindert, dass Benutzer damit interagieren oder Daten eingeben. Nützlich zur Anzeige von schreibgeschützten oder inaktiven Eingabefeldern.
<input type="text" value="New York" disabled />
Schreibgeschützt
readonly macht das Eingabefeld schreibgeschützt, sodass Benutzer den Wert sehen, aber nicht ändern können. Ähnlich wie das Attribut disabled, aber das Feld kann weiterhin fokussiert und ausgewählt werden.
<input type="text" value="USA" readonly />
Min und Max
min und max geben die minimal und maximal erlaubten Werte für numerische Eingabefelder an. Nützlich zur Durchsetzung von Einschränkungen bei numerischen Eingaben, wie Alter oder Menge.
<input type="number" min="21" max="99" />
Beispiel: Im Folgenden ein Beispiel, das alle notwendigen Attribute und Elemente für das Formular enthält.
index.html
Video-Tutorial
1. Welches Attribut zeigt einen Hinweis oder Beispieltext innerhalb eines Eingabefeldes an, um Benutzer über die erwartete Eingabe zu informieren?
2. Welches Attribut legt den Namen des Eingabefeldes fest, der zur Identifizierung der Eingabedaten beim Absenden des Formulars verwendet wird?
3. Welches Attribut verhindert das Absenden des Formulars, wenn das erforderliche Feld leer bleibt?
Danke für Ihr Feedback!
Fragen Sie AI
Fragen Sie AI
Fragen Sie alles oder probieren Sie eine der vorgeschlagenen Fragen, um unser Gespräch zu beginnen
Awesome!
Completion rate improved to 3.13
HTML-Eingabeattribute für Erweiterte Funktionalität
Swipe um das Menü anzuzeigen
Wir wissen bereits, wie man Formulare mit Eingabefeldern und Beschriftungen erstellt. Nun betrachten wir weitere nützliche Attribute für Eingabeelemente, die deren Funktionalität und Benutzerfreundlichkeit verbessern.
Allgemeine Attribute für Eingabeelemente
Platzhalter
placeholder bietet einen Hinweis oder Beispieltext innerhalb des Eingabefelds und gibt Nutzern eine Orientierung, welche Art von Eingabe erwartet wird. Nützlich zur Bereitstellung von Kontext oder Anweisungen, bevor Daten eingegeben werden.
<input type="text" placeholder="Enter your email" />
Name
name legt den Namen des Eingabefelds fest, der zur Identifizierung der Eingabedaten beim Absenden des Formulars verwendet wird. Jedes Eingabefeld innerhalb eines Formulars sollte ein eindeutiges name-Attribut besitzen.
<input type="text" name="username" />
Wert
value setzt den Anfangs- oder Standardwert des Eingabefelds. Das Eingabefeld wird beim Laden der Seite mit einem bestimmten Wert vorausgefüllt.
<input type="tel" value="+1 (484) 298-9732" />
Erforderlich
required gibt an, dass das Eingabefeld ausgefüllt werden muss, bevor das Formular abgeschickt werden kann. Verhindert das Absenden des Formulars, wenn das erforderliche Feld leer bleibt.
<input type="password" required />
Deaktiviert
disabled deaktiviert das Eingabefeld und verhindert, dass Benutzer damit interagieren oder Daten eingeben. Nützlich zur Anzeige von schreibgeschützten oder inaktiven Eingabefeldern.
<input type="text" value="New York" disabled />
Schreibgeschützt
readonly macht das Eingabefeld schreibgeschützt, sodass Benutzer den Wert sehen, aber nicht ändern können. Ähnlich wie das Attribut disabled, aber das Feld kann weiterhin fokussiert und ausgewählt werden.
<input type="text" value="USA" readonly />
Min und Max
min und max geben die minimal und maximal erlaubten Werte für numerische Eingabefelder an. Nützlich zur Durchsetzung von Einschränkungen bei numerischen Eingaben, wie Alter oder Menge.
<input type="number" min="21" max="99" />
Beispiel: Im Folgenden ein Beispiel, das alle notwendigen Attribute und Elemente für das Formular enthält.
index.html
Video-Tutorial
1. Welches Attribut zeigt einen Hinweis oder Beispieltext innerhalb eines Eingabefeldes an, um Benutzer über die erwartete Eingabe zu informieren?
2. Welches Attribut legt den Namen des Eingabefeldes fest, der zur Identifizierung der Eingabedaten beim Absenden des Formulars verwendet wird?
3. Welches Attribut verhindert das Absenden des Formulars, wenn das erforderliche Feld leer bleibt?
Danke für Ihr Feedback!