Dieser Inhalt wurde automatisch aus dem Englischen übersetzt, und kann Fehler enthalten.Erfahre mehr über dieses Experiment.
ValidityState: Eigenschaft valueMissing
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since Juli 2015.
Die schreibgeschütztevalueMissing-Eigenschaft desValidityState-Interfaces gibt an, ob ein erforderlichesrequired-Steuerelement, wie ein<input>,<select> oder<textarea>, einen leeren Wert hat.
Wenn dasrequired-Attribut gesetzt ist und keine<option> ausgewählt ist oder ein<textarea> oder ein vom Benutzer editierbares<input> leer ist, wird dievalueMissing-Eigenschafttrue sein. Die Eigenschaft ist nurtrue, wenn das Feld erforderlich ist und keinen Wert hat; wenn das Feld nicht erforderlich ist oder wenn das Feld erforderlich ist und einen Wert hat, ist der Wertfalse.
In diesem Artikel
Wert
Ein boolescher Wert, dertrue ist, wenn derValidityState nicht gesetzt ist und dasrequired-Attribut vorhanden ist.
Fehlender erforderlicher Eingabewert
Das folgende Beispiel überprüft die Gültigkeit einesnumerischen Eingabeelements. Es wurden Einschränkungen hinzugefügt, indem dasmin-Attribut verwendet wurde, das einen Mindestwert von18 für die Eingabe festlegt, und dasrequired-Attribut, das leere Werte nicht zulässt. Wenn der Benutzer einen Wert eingibt, der keine Zahl größer als 17 ist, schlägt die Einschränkungsvalidierung des Elements fehl, und die Stile, die:invalid entsprechen, werden angewendet.
input:invalid { outline: red solid 3px;}body { margin: 0.5rem;}pre { padding: 1rem; height: 2rem; background-color: lightgrey; outline: 1px solid grey;}<pre>Validation logged here...</pre><input type="number" min="18" required />const userInput = document.getElementById("age");const logElement = document.getElementById("log");function log(text) { logElement.innerText = text;}userInput.addEventListener("input", () => { userInput.reportValidity(); if (userInput.validity.valid) { log("Input OK…"); } else if (userInput.validity.valueMissing) { log("Required field cannot be empty."); } else { log(`Bad input detected: ${userInput.validationMessage}`); }});Spezifikationen
| Specification |
|---|
| HTML> # dom-validitystate-valuemissing-dev> |
Browser-Kompatibilität
Siehe auch
- ValidityStatebadInput,valid Eigenschaften.
- Einschränkungsvalidierung
- Formulare: Datenformularvalidierung
- Reguläre Ausdrücke