HTMLInputElement

Baseline Widely available *

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

* Some parts of this feature may have varying levels of support.

Das HTMLInputElement Interface bietet spezielle Eigenschaften und Methoden zur Manipulation der Optionen, des Layouts und der Präsentation von <input>-Elementen.

Instanz-Eigenschaften

Erbt auch Eigenschaften von seinem übergeordneten Interface, HTMLElement.

Einige Eigenschaften gelten nur für Eingabeelementtypen, die die entsprechenden Attribute unterstützen.

align Veraltet: Ein Zeichenfolgenwert, der die Ausrichtung des Elements darstellt. Verwenden Sie stattdessen CSS.
defaultValue: Ein Zeichenfolgenwert, der den Standardwert darstellt, wie er ursprünglich im HTML angegeben wurde, das dieses Objekt erstellt hat.
dirName: Ein Zeichenfolgenwert, der die Richtungseinstellung des Elements darstellt.
incremental Nicht standardisiert: Ein boolescher Wert, der den Modus des Suchereignis-Feuerns darstellt; wenn true, wird bei jedem Tastendruck oder beim Klicken auf die Abbrechen-Taste ausgelöst, andernfalls beim Drücken der Enter-Taste.
labels Schreibgeschützt: Gibt eine Liste von <label>-Elementen zurück, die Labels für dieses Element sind.
list Schreibgeschützt: Gibt das Element zurück, auf das durch das list-Attribut verwiesen wird. Die Eigenschaft kann null sein, wenn kein HTML-Element im selben Baum gefunden wird.
multiple: Ein boolescher Wert, der das multiple-Attribut des Elements darstellt und angibt, ob mehr als ein Wert möglich ist (z. B. mehrere Dateien).
name: Ein Zeichenfolgenwert, der das name-Attribut des Elements darstellt, das einen Namen enthält, der das Element beim Absenden des Formulars identifiziert.
popoverTargetAction: Ermittelt und setzt die auszuführende Aktion ("hide", "show" oder "toggle") auf einem durch ein <input>-Element von type="button" gesteuerten Popover-Element. Es spiegelt den Wert des popovertargetaction HTML-Attributes wider.
popoverTargetElement: Ermittelt und setzt das zu steuernde Popover-Element über ein <input>-Element von type="button". Das JavaScript-Äquivalent des popovertarget HTML-Attributes.
step: Ein Zeichenfolgenwert, der das step-Attribut des Elements darstellt, welches zusammen mit min und max die Inkremente einschränkt, bei denen ein numerischer oder Datum-Zeit-Wert gesetzt werden kann. Es kann der String any oder eine positive Gleitkommazahl sein. Wenn dies nicht auf any gesetzt ist, akzeptiert die Steuerung nur Werte bei Vielfachen des Schrittwertes, die größer als das Minimum sind.
type: Ein Zeichenfolgenwert, der das type-Attribut des Elements darstellt und angibt, welcher Steuerungstyp angezeigt werden soll. Für mögliche Werte siehe die Dokumentation für das type-Attribut.
useMap Veraltet: Ein Zeichenfolgenwert, der eine clientseitige Bildkarte darstellt.
value: Ein Zeichenfolgenwert, der den aktuellen Wert der Steuerung darstellt. Wenn der Benutzer einen anderen als den erwarteten Wert eingibt, kann dies eine leere Zeichenkette zurückgeben.
valueAsDate: Ein Date, das den Wert des Elements interpretiert als Datum darstellt, oder null, wenn eine Umwandlung nicht möglich ist.
valueAsNumber: Eine Zahl, die den Wert des Elements darstellt, interpretiert als eine der folgenden, in der Reihenfolge: Ein Zeitwert, eine Zahl oder NaN, wenn eine Umwandlung unmöglich ist.

Instanz-Eigenschaften im Zusammenhang mit dem übergeordneten Formular

form Schreibgeschützt: Gibt eine Referenz zum übergeordneten <form>-Element zurück.
formAction: Ein Zeichenfolgenwert, der das formaction-Attribut des Elements darstellt, die die URL eines Programms enthält, das die vom Element übermittelten Informationen verarbeitet. Dies überschreibt das action-Attribut des übergeordneten Formulars.
formEnctype: Ein Zeichenfolgenwert, der das formenctype-Attribut des Elements darstellt und den Typ von Inhalten enthält, der verwendet wird, um das Formular an den Server zu übermitteln. Dies überschreibt das enctype-Attribut des übergeordneten Formulars.
formMethod: Ein Zeichenfolgenwert, der das formmethod-Attribut des Elements darstellt und die HTTP-Methode enthält, mit der der Browser das Formular übermittelt. Dies überschreibt das method-Attribut des übergeordneten Formulars.
formNoValidate: Ein boolescher Wert, der das formnovalidate-Attribut des Elements darstellt und angibt, dass das Formular nicht validiert werden soll, wenn es übermittelt wird. Dies überschreibt das novalidate-Attribut des übergeordneten Formulars.
formTarget: Ein Zeichenfolgenwert, der das formtarget-Attribut des Elements darstellt und einen Namen oder ein Schlüsselwort enthält, das angibt, wo die Antwort nach dem Absenden des Formulars angezeigt werden soll. Dies überschreibt das target-Attribut des übergeordneten Formulars.

Instanz-Eigenschaften, die für jeden nicht versteckten Eingabetyp gelten

disabled: Ein boolescher Wert, der das disabled-Attribut des Elements darstellt und angibt, dass die Steuerung nicht für die Interaktion verfügbar ist. Die Eingabewerte werden nicht mit dem Formular übermittelt. Siehe auch readonly.
required: Ein boolescher Wert, der das required-Attribut des Elements darstellt und angibt, dass der Benutzer einen Wert eingeben muss, bevor er ein Formular absenden kann.
validationMessage Schreibgeschützt: Gibt eine lokalisierte Nachricht zurück, die die Validierungsbeschränkungen beschreibt, die die Steuerung nicht erfüllt (falls vorhanden). Dies ist die leere Zeichenkette, wenn die Steuerung kein Kandidat für die Beschränkungsvalidierung ist (willValidate ist false), oder wenn sie ihre Beschränkungen erfüllt. Dieser Wert kann durch die Methode setCustomValidity() festgelegt werden.
validity Schreibgeschützt: Gibt den aktuellen Gültigkeitsstatus des Elements zurück.
willValidate Schreibgeschützt: Gibt zurück, ob das Element ein Kandidat für die Beschränkungsvalidierung ist. Es ist false, wenn irgendwelche Bedingungen es von der Beschränkungsvalidierung ausschließen, einschließlich: sein type ist einer von hidden, reset oder button, es hat einen Vorfahren vom Typ <datalist> oder seine Eigenschaft disabled ist true.

Instanz-Eigenschaften, die nur für Elemente vom Typ Checkbox oder Radio gelten

checked: Ein boolescher Wert, der den aktuellen Zustand des Elements darstellt.
defaultChecked: Ein boolescher Wert, der den Standardzustand eines Auswahlknopfs oder Kontrollkästchens darstellt, wie er ursprünglich im HTML angegeben wurde, das dieses Objekt erstellt hat.
indeterminate: Ein boolescher Wert, der darstellt, ob das Kontrollkästchen oder der Auswahlknopf im indeterminierten Zustand ist. Für Kontrollkästchen bedeutet dies, dass das Erscheinungsbild des Kontrollkästchens irgendwie verdeckt/grau dargestellt wird, um anzuzeigen, dass sein Zustand unbestimmt ist (nicht markiert, aber auch nicht nicht markiert). Dies hat keine Auswirkungen auf den Wert des checked-Attributes, und ein Klick auf das Kontrollkästchen setzt den Wert auf false.

Instanz-Eigenschaften, die nur für Elemente vom Typ Bild gelten

alt: Ein Zeichenfolgenwert, der das alt-Attribut des Elements darstellt und alternativen Text enthält, der verwendet werden soll.
height: Ein Zeichenfolgenwert, der das height-Attribut des Elements darstellt, das die Höhe des Bildes definiert, das für den Button angezeigt wird.
src: Ein Zeichenfolgenwert, der das src-Attribut des Elements darstellt, das eine URI für den Standort eines Bildes angibt, das auf dem grafischen Senden-Button angezeigt werden soll.
width: Ein Zeichenfolgenwert, der das width-Attribut des Elements darstellt, das die Breite des Bildes definiert, das für den Button angezeigt wird.

Instanz-Eigenschaften, die nur für Elemente vom Typ Datei gelten

accept: Ein Zeichenfolgenwert, der das accept-Attribut des Elements darstellt und eine kommagetrennte Liste von Dateitypen enthält, die ausgewählt werden können.
capture: Ein Zeichenfolgenwert, der das capture-Attribut des Elements darstellt und die Multimedia-Aufnahmemethode in Datei-Upload-Steuerelementen angibt.
files: Ein FileList, das die für den Upload ausgewählten Dateien darstellt.
webkitdirectory: Ein boolescher Wert, der das webkitdirectory-Attribut darstellt. Wenn true, akzeptiert die Dateisystemauswahloberfläche nur Verzeichnisse statt Dateien.
webkitEntries Schreibgeschützt: Beschreibt die aktuell ausgewählten Dateien oder Verzeichnisse.

Instanz-Eigenschaften, die nur für sichtbare Elemente mit Text oder Zahlen gelten

autocomplete: Ein Zeichenfolgenwert, der das autocomplete-Attribut des Elements darstellt und angibt, ob der Wert der Steuerung automatisch vom Browser vervollständigt werden kann.
max: Ein Zeichenfolgenwert, der das max-Attribut des Elements darstellt und den maximalen (numerischen oder datumszeitlichen) Wert für diesen Artikel angibt, der nicht geringer als sein Mindestwert (min)-Attribut sein darf.
maxLength: Eine Zahl, die das maxlength-Attribut des Elements darstellt und die maximale Anzahl an Zeichen (in Unicode-Code-Punkten) enthält, die der Wert haben kann.
min: Ein Zeichenfolgenwert, der das min-Attribut des Elements darstellt und den minimalen (numerischen oder datumszeitlichen) Wert für diesen Artikel angibt, der nicht größer als sein Höchstwert (max)-Attribut sein darf.
minLength: Eine Zahl, die das minlength-Attribut des Elements darstellt und die minimale Anzahl an Zeichen (in Unicode-Code-Punkten) enthält, die der Wert haben kann.
pattern: Ein Zeichenfolgenwert, der das pattern-Attribut des Elements darstellt und einen regulären Ausdruck enthält, gegen den der Wert der Steuerung geprüft wird. Verwenden Sie das title-Attribut, um das Muster zu beschreiben und dem Benutzer zu helfen. Dieses Attribut gilt nur, wenn der Wert des type-Attributes text, search, tel, url oder email ist.
placeholder: Ein Zeichenfolgenwert, der das placeholder-Attribut des Elements darstellt und einen Hinweis für den Benutzer enthält, was in die Steuerung eingegeben werden kann. Der Platzhalter-Text darf keine Wagenrückläufe oder Zeilenumbrüche enthalten. Dieses Attribut gilt nur, wenn der Wert des type-Attributes text, search, tel, url oder email ist.
readOnly: Ein boolescher Wert, der das readonly-Attribut des Elements darstellt und angibt, dass der Benutzer den Wert der Steuerung nicht ändern kann. Dies wird ignoriert, wenn der type auf hidden, range, color, checkbox, radio, file oder einen Button-Typ gesetzt ist.
selectionDirection: Ein Zeichenfolgenwert, der die Richtung angibt, in der die Auswahl getroffen wurde. Mögliche Werte sind: forward (die Auswahl wurde in die Start-zu-Ende-Richtung der aktuellen Lokalisierung durchgeführt), backward (die gegensätzliche Richtung) oder none (die Richtung ist unbekannt).
selectionEnd: Eine Zahl, die das End-Index der ausgewählten Zeichen darstellt. Wenn keine Auswahl getroffen wurde, wird der Versatz des Zeichens direkt nach der aktuellen Textcursor-Position zurückgegeben.
selectionStart: Eine Zahl, die das Start-Index der ausgewählten Zeichen darstellt. Wenn nichts ausgewählt ist, wird die Position des Textcursors (Caret) innerhalb des <input>-Elements zurückgegeben.
size: Eine Zahl, die das size-Attribut des Elements darstellt und die visuelle Größe der Steuerung enthält. Dieser Wert ist in Pixeln, es sei denn, der Wert des type ist text oder password, in diesem Fall ist es eine ganzzahlige Anzahl von Zeichen. Gilt nur, wenn type auf text, search, tel, url, email oder password gesetzt ist.

Instanz-Methoden

Erbt auch Methoden von seinem übergeordneten Interface, HTMLElement.

checkValidity(): Gibt einen booleschen Wert zurück, der false ist, wenn das Element ein Kandidat für die Beschränkungsvalidierung ist und es seine Beschränkungen nicht erfüllt. In diesem Fall wird auch ein invalid-Ereignis auf dem Element ausgelöst. Es gibt true zurück, wenn das Element kein Kandidat für die Beschränkungsvalidierung ist oder wenn es seine Beschränkungen erfüllt.
reportValidity(): Führt die Methode checkValidity() aus, und wenn sie false zurückgibt (für eine ungültige Eingabe oder kein bereitgestelltes Musterattribut), wird dem Benutzer auf dieselbe Weise wie beim Absenden eines Formulars gemeldet, dass die Eingabe ungültig ist.
select(): Wählt den gesamten Text im Eingabeelement aus und fokussiert es, sodass der Benutzer anschließend den gesamten Inhalt ersetzen kann.
setCustomValidity(): Legt eine benutzerdefinierte Validierungsnachricht für das Element fest. Wenn diese Nachricht nicht die leere Zeichenkette ist, leidet das Element an einem benutzerdefinierten Validitätsfehler und wird nicht validiert.
setRangeText(): Ersetzt einen Bereich von Text im Eingabeelement durch neuen Text.
setSelectionRange(): Wählt einen Bereich von Text im Eingabeelement aus (fokussiert es jedoch nicht).
showPicker(): Zeigt einen Browser-Auswahldialog für Datum, Zeit, Farbe und Dateien.
stepDown(): Vermindert den value um (step * n), wobei n standardmäßig 1 ist, wenn nicht angegeben.
stepUp(): Erhöht den value um (step * n), wobei n standardmäßig 1 ist, wenn nicht angegeben.

Ereignisse

Erbt auch Ereignisse von seinem übergeordneten Interface, HTMLElement.

Hören Sie diese Ereignisse mit addEventListener() oder indem Sie einen Ereignislistener der oneventname-Eigenschaft dieses Interface zuweisen:

cancel Ereignis: Wird ausgelöst, wenn der Benutzer den Datei-Auswahldialog über die Esc-Taste oder die Abbrechen-Taste abbricht und wenn der Benutzer erneut dieselben Dateien auswählt, die zuvor ausgewählt wurden.
invalid Ereignis: Wird ausgelöst, wenn ein Element während der Beschränkungsvalidierung seine Beschränkungen nicht erfüllt.
search Ereignis Nicht standardisiert: Wird ausgelöst, wenn eine Suche in einem <input> von type="search" initiiert wird.
select Ereignis: Wird ausgelöst, wenn Text ausgewählt wurde.
selectionchange Ereignis Experimentell: Wird ausgelöst, wenn die Textauswahl in einem <input>-Element geändert wurde.

Spezifikationen

Specification
HTML # htmlinputelement

Browser-Kompatibilität

Siehe auch

HTML-Element, das dieses Interface implementiert: <input>