oninvalid event
Paglilinaw at paggamit
Nangyayari ang oninvalid event kapag ang <input> na puwedeng isumite ay hindi wasto.
Halimbawa, kung na-set ang attribute na required, at ang field ay walang laman, ang input field ay hindi mahalaga (ang attribute na required ay nagtutukoy na ang input field ay dapat ipunan bago ang pagsumite ng form).
Mga halimbawa
Mga halimbawa 1
Kung ang may sulok ng imput ay hindi wasto, magbigay ng isang mensahe:
<input type="text" oninvalid="alert('You must fill out the form!');" required>
May mas maraming TIY na halimbawa sa ibaba ng pahina.
Pahiyagang balay:
Sa HTML:
<element oninvalid="myScript">
Sa JavaScript:
object.oninvalid = function(){myScript};
Sa JavaScript, gamit ang addEventListener() na paraan:
object.addEventListener("invalid", myScript);
Komento:Internet Explorer 8 o mas maagang bersyon ay hindi sumusuporta addEventListener() na paraan.
Detalye ng teknolohiya
| Bububong: | Hindi suportado |
|---|---|
| Maaaring kanselahin: | Suporta |
| Uri ng kaganapan: | Kaganapan |
| Suportadong HTML na tag: | <input> |
| DOM na bersyon: | Level 3 Events |
Suporta ng browser
Ang mga numero sa talahanayan ay nagpapahiwatig na ang unang bersyon ng browser na ganap na sumusuporta sa kaganapan.
| Kaganapan | Chrome | IE | Firefox | Safari | Opera |
|---|---|---|---|---|---|
| oninvalid | Suporta | 10.0 | Suporta | Suporta | Suporta |
Mga mas maraming halimbawa
Mga halimbawa 2
Kung ang may sulok ng imput ay may mas mababang 6 na character, magbigay ng isang mensahe:
Name: <input type="text" id="myInput" name="fname" pattern=".{6,}" required>
<script>
document.getElementById("myInput").addEventListener("invalid", myFunction);
function myFunction() {
alert("Dapat may 6 o higit pang mga character");
}
</script>
Mga halimbawa 3
Kung ang may sulok ng imput ay may数字 na mas mababa sa 2 o mas malaki sa 5, magbigay ng isang mensahe:
Number: <input type="number" id="myInput" name="quantity" min="2" max="5" required>
<script>
document.getElementById("myInput").addEventListener("invalid", myFunction);
function myFunction() {
alert("Kailangan mong pilihin ang isang numero sa pagitan ng 2 at 5. Pinili mo: " + this.value);
}
</script>
