ValidityState: Eigenschaft valueMissing

Baseline Weitgehend verfgbar

Diese Funktion ist gut etabliert und funktioniert auf vielen Gerten und in vielen Browserversionen. Sie ist seit Juli 2015 browserbergreifend verfgbar.

Mehr erfahren
Vollstndige Kompatibilitt anzeigen

Die schreibgeschtzte valueMissing-Eigenschaft des ValidityState-Interfaces gibt an, ob ein erforderliches required-Steuerelement, wie ein <input>, <select> oder <textarea>, einen leeren Wert hat.

Wenn das required-Attribut gesetzt ist und keine <option> ausgewhlt ist oder ein <textarea> oder ein vom Benutzer editierbares <input> leer ist, wird die valueMissing-Eigenschaft true sein. Die Eigenschaft ist nur true, 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 Wert false.

Wert

Ein boolescher Wert, der true ist, wenn der ValidityState nicht gesetzt ist und das required-Attribut vorhanden ist.

Fehlender erforderlicher Eingabewert

Das folgende Beispiel berprft die Gltigkeit eines numerischen Eingabeelements. Es wurden Einschrnkungen hinzugefgt, indem das min-Attribut verwendet wurde, das einen Mindestwert von 18 fr die Eingabe festlegt, und das required-Attribut, das leere Werte nicht zulsst. Wenn der Benutzer einen Wert eingibt, der keine Zahl grer als 17 ist, schlgt die Einschrnkungsvalidierung des Elements fehl, und die Stile, die :invalid entsprechen, werden angewendet.

css

input:invalid {
  outline: red solid 3px;
}

body {
  margin: 0.5rem;
}
pre {
  padding: 1rem;
  height: 2rem;
  background-color: lightgrey;
  outline: 1px solid grey;
}

html

<pre id="log">Validation logged here...</pre>
<input type="number" id="age" 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

Spezifikation
HTML # dom-validitystate-valuemissing-dev

Browser-Kompatibilitt

Siehe auch

ValidityState badInput, valid Eigenschaften.
Einschrnkungsvalidierung
Formulare: Datenformularvalidierung
Regulre Ausdrcke

Help improve MDN

War diese bersetzung hilfreich?

Ja Nein

Erfahren Sie, wie Sie beitragen knnen Diese Seite wurde automatisch aus dem Englischen bersetzt.

bersetzung auf GitHub anzeigen Fehler mit dieser bersetzung melden