HTML/Elemente/input
Aus SELFHTML-Wiki
Der Titel dieses Artikels ist mehrdeutig.
Neben dem HTML-Element input gibt es noch das gleichnamige input (oninput)-Ereignis.
Das input-Element stellt ein Datenfeld dar, das in der Regel mit einem form-Element in Verbindung steht, wodurch es dem Benutzer ermöglicht wird, Daten zu bearbeiten.
Beispiel
<form>
<label for="vname">Vorname:
<input id="vname" name="vname">
</label>
<label for="zname">Zuname:
<input id="zname" name="zname">
</label>
<label for="männl">männlich</label>
<input type="radio" id="männl" name="geschlecht" value="0">
<label for="weibl">weiblich</label>
<input type="radio" id="weibl" name="geschlecht" value="1">
<label for="queer">queer</label>
<input type="radio" id="queer" name="geschlecht" value="2">
<label for="alter">über 18:</label>
<input type="checkbox" id="alter" name="alter">
<input type="submit" value="senden"><nowiki>
</form>
Beachten Sie: Das
<input>
-Tag ist ein so genanntes Standalone-Tag. Bei xml-konformer Schreibweise (wie z. B. in XHTML) benötigt das input-Tag den schließenden Schrägstrich (/
).
In HTML5 können Sie den /
weglassen.Siehe auch
- HTML/Tutorials/Formulare/input
(Tutorial über Eingabefelder, Checkboxen, Radio-Buttons, etc) - HTML/Tutorials/Formulare
Weblinks
- Spezifikation (W3C): The input-Element
Syntax | Start-Tag: notwendig End-Tag: verboten <input> |
---|---|
WAI-ARIA-Rolle |
|
Elternelemente | Darf vorkommen in:
Information: Elemente, die fließenden Inhalt erlauben
|
erlaubte Inhalte |
keine, leeres Element |
Name | Inhalt | Standardwert | Bedeutung |
---|---|---|---|
Universalattribute | |||
id | ID | identifiziert ein einziges Element innerhalb eines Dokuments | |
class | CDATA | ordnet ein Element einer oder mehreren Klassen zu. | |
accesskey | ID | Tastaturkürzel | |
contenteditable | CDATA | editierbarer Inhalt | |
contextmenu | definiert Kontextmenü | ||
dir | ltr, rtl | definiert die Schreibrichtung innerhalb des Dokuments | |
draggable | ID | kann mit Drag & Drop gezogen werden | |
dropzone | CDATA | Aktion bei Ablegen | |
hidden | versteckter Inhalt | ||
lang | NAME | legt eine den IANA-Sprachdefinitionen folgende Sprache des Elementinhalts fest [RFC1766] | |
spellcheck | ID | Rechtschreibprüfung | |
style | CDATA | notiert direkt in einem Element- style sheet data | |
tabindex | NAME | zeigt an, ob dieses Element fokusiert werden kann, ob es mithilfe der Tastaturnavigation angesteuert werden kann und in welcher Reihenfolge navigiert wird. | |
title | CDATA | betitelt oder beschreibt ein Element. | |
type | text, button, checkbox, color, date, datetime, datetime-local, email, file, hidden, image, month, number, password, radio, range, reset, search, submit, tel, time, url, week | text | Bestimmt den Typen des Eingabe-Elementes. |
accept | CDATA | Wenn das Element für den Typ Datei ist, bestimmt dieses die Dateitypen die vom Server akzeptiert werden. Eine durch Komma getrennte Liste der MIME- oder Medientypen, siehe RFC2045 | |
autocomplete | off, on | bestimmt, ob der, im Element eingegebene Wert, automatisch durch den Browser vervollständigt werden kann. Dieses Attribut wird ignoriert, wenn der Typedes Elementes hidden, password, checkbox, radio, file oder eine Schaltfläche ist. | |
alt | CDATA | alternativer Text, der angezeigt wird, wenn das Element vom Typ Image ist und das Bild nicht geladen werden kann. | |
autofocus | Boolesches Attribut | Focus wird beim Laden auf dieses Element gelegt. | |
checked | Boolesches Attribut | bestimmt, dass Radio-Schaltflächen und Checkboxen vorausgewählt sind | |
disabled | Boolesches Attribut | legt fest, dass das Element ausgegraut, d.h. nicht benutzbar ist | |
form | CDATA | Identifizierungsname des form-Elements mit dem es in Verbindung steht. | |
formaction | CDATA | URI der Datei (Script), die die Verarbeitung der Eingaben übernimmt. | |
formenctype | application/x-www-form-urlencoded, multipart/form-data, text/plain | application/x-www-form-urlencoded | legt den Inhalts-Typ fest. |
formmethod | GET, POST | bestimmt, mit welcher Anfragemethode der Browser die Daten des Elements übermittelt. | |
formnovalidate | Boolesches Attribut | legt fest, dass das Formular vor dem Senden nicht überprüft wird, wenn das Element vom Type button oder image ist. | |
formtarget | _self, _blank, _parent, _top | _self | bestimmt das Zielfenster, in dem die ausgewerteten Daten angezeigt werden, wenn das Eingabeelement vom Type button oder image ist. |
height | CDATA | bestimmt die Höhe des Elements, wenn das Element vom Typ image ist. | |
inputmode | verbatim, latin, latin-name, latin-prose, full-width-latin, kana, katakana, numeric, tel, email, url | Ein Hinweis an den Browser, welche Tastatur angezeigt werden soll, wenn das Element vom Typ text, password, email oder url ist. | |
list | CDATA | Identifizierungsname des datalist-Elements mit dem es in Verbindung steht. | |
max | NUMBER | maximaler (numerischer oder Datum/Uhrzeit) Wert für dieses Element, das nicht weniger als der Minimalwert (min-Attribut) sein darf. | |
maxlength | NUMBER | Die maximale Anzahl von Zeichen für ein Textfeld, wenn diese vom Typ text, email, search, password, tel, oder url ist. | |
min | NUMBER | Der minimale (numerische oder Datum/Uhrzeit) Wert für dieses Element, das nicht größer als der Maximalwert (max-Attribut) sein darf. | |
minlength | NUMBER | Die minimale Anzahl von Zeichen für ein Textfeld, wenn diese vom Typ text, email, search, password, tel, oder url ist. | |
multiple | Boolesches Attribut | Bestimmt, dass der Benutzer mehr als einen Wert auswählen kann, wenn der Typ des Elements email oder file ist. | |
name | CDATA | Name des Elementes, welcher mit den Formulardaten übermittelt wird. | |
pattern | CDATA | Suchmuster mit Hilfe von Regulären Ausdrücken. | |
placeholder | CDATA | Platzhalter die die Art der Eingabe vorschlagen. | |
readonly | Boolesches Attribut | bestimmt, dass der Wert des Elements nicht verändert werden kann. Ist das Element vom Type hidden, range, color, checkbox, radio, file oder button, wird dieses Attribut ignoriert. | |
required | Boolesches Attribut | bestimmt, dass eine Eingabe in das Element erfolgen muss, bevor es abgesendet werden kann. Das Attribut kann nicht genutzt werden, wenn das Eingabeelement vom Type hidden, image, oder button ist. | |
size | CDATA | bestimmt die Größe des Elementes in Pixeln, es sei denn der Typ des Elementes ist text oder password. In diesem Fall wäre es die Anzahl an Zeichen. | |
src | CDATA | Wenn das Eingabeelement vom Typ image ist, gibt dies den URI Verzeichnisspfad des Bildes an, welches auf der Schaltfläche angezeigt wird. Anderfalls wird dieses Attribut ignoriert. | |
step | CDATA | legt Schritte für die min und max Attribute fest | |
value | CDATA | bestimmt den Initialisierungswert des Elements. Dieser Wert wird ignoriert, wenn das Element vom Typ radio oder checkbox ist. | |
width | CDATA | Wenn das Element vom Type Bild ist, definiert dieses Attribut die Breite des Bildes das auf der Schaltfläche angezeigt wird. |
Attribut: Pflichtattribut
Attribut: optionales Attribut