Baseline Widely available
Die checkValidity()
Methode des HTMLInputElement
Interfaces gibt einen booleschen Wert zurück, der anzeigt, ob das Element die darauf angewendeten Constraint-Validierungsregeln erfüllt. Wenn der Wert false
ist, löst die Methode auch ein invalid
Ereignis auf dem Element aus. Da es kein Standardverhalten des Browsers für checkValidity()
gibt, hat das Abbrechen dieses invalid
Ereignisses keine Wirkung.
Hinweis: Ein HTML <input>
Element mit einer nicht-null validationMessage
wird als ungültig angesehen, passt zur CSS :invalid
Pseudoklasse und führt dazu, dass checkValidity()
false
zurückgibt. Verwenden Sie die HTMLInputElement.setCustomValidity()
Methode, um die HTMLInputElement.validationMessage
auf die leere Zeichenkette zu setzen, um den validity
Zustand als gültig festzulegen.
Keine.
RückgabewertGibt true
zurück, wenn der Wert des Elements keine Validitätsprobleme aufweist; andernfalls wird false
zurückgegeben.
Wir fügen ein Formular mit einem erforderlichen Zahlenfeld und zwei Schaltflächen hinzu: eine zur Ãberprüfung des Formulars und die andere, um es zu senden.
<form action="#" method="post">
<p>
<label for="age">Your (21 to 65) </label>
<input type="number" name="age" required id="age" min="21" max="65" />
</p>
<p>
<button type="submit">Submit</button>
<button type="button" id="check">checkValidity()</button>
</p>
<p id="log"></p>
</form>
JavaScript
const output = document.querySelector("#log");
const checkButton = document.querySelector("#check");
const ageInput = document.querySelector("#age");
ageInput.addEventListener("invalid", () => {
console.log("Invalid event fired.");
});
checkButton.addEventListener("click", () => {
const checkVal = ageInput.checkValidity();
output.innerHTML = `checkValidity returned: ${checkVal}`;
});
Ergebnisse
Wenn der Wert false
ist, weil er fehlt, unter 21, über 65 oder anderweitig ungültig ist, wird das ungültige Ereignis der Konsole protokolliert. Um den Fehler dem Benutzer zu melden, verwenden Sie stattdessen HTMLInputElement.reportValidity()
.
Diese Seite wurde automatisch aus dem Englischen übersetzt.
RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.4