ElementInternals: setValidity() Methode

Baseline 2023

Newly available

Since March 2023, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.

Die setValidity() Methode der ElementInternals Schnittstelle setzt die Gültigkeit des Elements.

Syntax

js
setValidity(flags)
setValidity(flags, message)
setValidity(flags, message, anchor)

Parameter

flags Optional

Ein Wörterbuch-Objekt, das ein oder mehrere Flags enthält, die den Gültigkeitszustand des Elements anzeigen:

valueMissing

Ein boolescher Wert, der true ist, wenn das Element ein required Attribut hat, aber keinen Wert, oder false andernfalls. Wenn true, entspricht das Element der :invalid CSS-Pseudoklasse.

typeMismatch

Ein boolescher Wert, der true ist, wenn der Wert nicht im erforderlichen Syntaxformat ist (wenn type email oder url ist), oder false, wenn der Syntax korrekt ist. Wenn true, entspricht das Element der :invalid CSS-Pseudoklasse.

patternMismatch

Ein boolescher Wert, der true ist, wenn der Wert dem angegebenen pattern nicht entspricht, und false, wenn er passt. Wenn true, entspricht das Element der :invalid CSS-Pseudoklasse.

tooLong

Ein boolescher Wert, der true ist, wenn der Wert die angegebene maxlength für HTMLInputElement oder HTMLTextAreaElement Objekte überschreitet, oder false, wenn seine Länge kleiner oder gleich der maximalen Länge ist. Wenn true, entspricht das Element den CSS-Pseudoklassen :invalid und :out-of-range.

tooShort

Ein boolescher Wert, der true ist, wenn der Wert die angegebene minlength für HTMLInputElement oder HTMLTextAreaElement Objekte nicht erfüllt, oder false, wenn seine Länge größer oder gleich der minimalen Länge ist. Wenn true, entspricht das Element den CSS-Pseudoklassen :invalid und :out-of-range.

rangeUnderflow

Ein boolescher Wert, der true ist, wenn der Wert kleiner ist als das durch das min Attribut angegebene Minimum, oder false, wenn er größer oder gleich dem Minimum ist. Wenn true, entspricht das Element den CSS-Pseudoklassen :invalid und :out-of-range.

rangeOverflow

Ein boolescher Wert, der true ist, wenn der Wert größer ist als das durch das max Attribut angegebene Maximum, oder false, wenn er kleiner oder gleich dem Maximum ist. Wenn true, entspricht das Element den CSS-Pseudoklassen :invalid und :out-of-range.

stepMismatch

Ein boolescher Wert, der true ist, wenn der Wert nicht den durch das step Attribut festgelegten Regeln entspricht (das heißt, er ist nicht gleichmäßig durch den Schrittwert teilbar), oder false, wenn er der Schrittregel entspricht. Wenn true, entspricht das Element den CSS-Pseudoklassen :invalid und :out-of-range.

badInput

Ein boolescher Wert, der true ist, wenn der Benutzer eine Eingabe gemacht hat, die der Browser nicht umwandeln kann.

customError

Ein boolescher Wert, der anzeigt, ob die benutzerdefinierte Gültigkeitsnachricht des Elements durch den Aufruf der Methode setCustomValidity() des Elements auf einen nicht-leeren String gesetzt wurde.

Hinweis: Um alle Flags auf false zu setzen, was darauf hinweist, dass dieses Element alle Validierungsregeln erfüllt, geben Sie ein leeres Objekt {} ein. In diesem Fall müssen Sie auch keine message übergeben.

message Optional

Ein String, der eine Nachricht enthält, die gesetzt wird, wenn irgendein flags auf true steht. Dieser Parameter ist nur optional, wenn alle flags false sind.

anchor Optional

Ein HTMLElement, das vom Benutzeragenten verwendet werden kann, um Probleme bei dieser Formularübermittlung zu melden.

Rückgabewert

Keiner (undefined).

Ausnahmen

NotSupportedError DOMException

Ausgelöst, wenn das Element nicht seine formAssociated Eigenschaft zu true gesetzt hat.

TypeError

Ausgelöst, wenn eines oder mehrere flags true sind.

NotFoundError DOMException

Ausgelöst, wenn anchor angegeben ist, aber das Ziel nicht ein Schatten-inkludierender Nachfahre des Elements ist.

Beispiele

Im folgenden Beispiel wird setValidity mit einem leeren flags Parameter aufgerufen, um anzuzeigen, dass das Element die Validierungsregeln erfüllt.

js
this.internals_.setValidity({});

Im folgenden Beispiel wird setValidity mit dem Flag valueMissing auf true gesetzt aufgerufen. Ein message Parameter muss dann auch übergeben werden, der eine Nachricht enthält.

js
this.internals_.setValidity({ valueMissing: true }, "my message");

Spezifikationen

Specification
HTML Standard
# dom-elementinternals-setvalidity

Browser-Kompatibilität

BCD tables only load in the browser