Metody ograniczające walidacji DOM
| Nieruchomość | Opis |
|---|---|
| checkValidity() | Zwraca true, jeśli element wejściowy zawiera prawidłowe dane. |
| setCustomValidity() | Ustawia właściwość validationMessage elementu wejściowego. |
Jeśli pole wejściowe zawiera nieprawidłowe dane, wyświetli komunikat:
CheckValidity () Metoda
<input id="id1" type="number" min="100" max="300">
<button onclick="myFunction()">OK</button>
<p id="demo"></p>
<script>
function myFunction() {
var inpObj =
document.getElementById("id1");
if (inpObj.checkValidity()
== false) {
document.getElementById("demo").innerHTML = inpObj.validationMessage;
}
}
</script> Spróbuj sam " Ograniczające Validation Properties DOM
| Nieruchomość | Opis |
|---|---|
| validity | Zawiera właściwości logicznych związanych z ważnością elementu wejściowego. |
| validationMessage | Zawiera komunikat przeglądarka wyświetli gdy ważność jest fałszywe. |
| willValidate | Wskazuje, czy element wejściowy zostanie zatwierdzone. |
Właściwości Ważność
Nieruchomość ważność elementu wejściowego zawiera szereg właściwości dotyczące ważności danych:
| Nieruchomość | Opis |
|---|---|
| customError | Ustawiona na wartość true, jeśli niestandardowy komunikat ważność jest ustawiony. |
| patternMismatch | Ustawiona na wartość true, jeśli wartość elementu nie odpowiada jego atrybut wzór. |
| rangeOverflow | Ustawiona na wartość true, jeśli wartość elementu jest większa niż jego atrybut max. |
| rangeUnderflow | Ustawiona na wartość true, jeśli wartość elementu jest mniejsza niż jego atrybutu min. |
| stepMismatch | Ustawiona na wartość true, jeśli wartość elementu jest nieprawidłowy za jego atrybutem kroku. |
| tooLong | Ustawiona na wartość true, jeśli wartość elementu przewyższa jego atrybut MaxLength. |
| typeMismatch | Ustawiona na wartość true, jeśli wartość elementu jest nieprawidłowy za jego atrybutu type. |
| valueMissing | Ustawiona na wartość true, jeśli element (z wymaganym atrybutem) nie ma wartości. |
| valid | Ustawiona na wartość true, jeśli wartość elementu jest ważna. |
Przykłady
Jeśli numer w polu wprowadzania jest większa niż 100 (max przypisują wejściowego), wyświetli komunikat:
RangeOverflow nieruchomości
<input id="id1" type="number" max="100">
<button onclick="myFunction()">OK</button>
<p id="demo"></p>
<script>
function myFunction() {
var txt = "";
if (document.getElementById("id1").validity.rangeOverflow) {
txt = "Value too large";
}
document.getElementById("demo").innerHTML = txt;
}
</script>
Spróbuj sam " Jeśli numer w polu wprowadzania jest mniejsza niż 100 (atrybut min wejściowego), wyświetli komunikat:
RangeUnderflow nieruchomości
<input id="id1" type="number" min="100">
<button onclick="myFunction()">OK</button>
<p id="demo"></p>
<script>
function myFunction() {
var txt = "";
if (document.getElementById("id1").validity.rangeUnderflow) {
txt = "Value too small";
}
document.getElementById("demo").innerHTML = txt;
}
</script>
Spróbuj sam "