Acara tidak valid
Contoh
Beri tahu beberapa teks jika bidang input tidak valid:
<input type="text" oninvalid="alert('You must fill out the form!');" required>
Lebih banyak contoh "Coba Sendiri" di bawah ini.
Definisi dan Penggunaan
Peristiwa oninvalid terjadi ketika elemen <input> yang dapat dikirimkan tidak valid.
Misalnya, kolom input tidak valid jika atribut yang diperlukan disetel dan kolom kosong (atribut yang diperlukan menentukan bahwa kolom input harus diisi sebelum mengirimkan formulir).
Dukungan Peramban
Angka-angka dalam tabel menentukan versi browser pertama yang sepenuhnya mendukung acara tersebut.
Event | |||||
---|---|---|---|---|---|
oninvalid | Yes | 10.0 | Yes | Yes | Yes |
Sintaksis
Dalam HTML:
<element oninvalid="myScript">
Dalam JavaScript:
object.oninvalid = function(){myScript};
Dalam JavaScript, menggunakan metode addEventListener() :
object.addEventListener("invalid", myScript);
Catatan: Metode addEventListener() tidak didukung di Internet Explorer 8 dan versi yang lebih lama.
Detail Teknis
Gelembung: | Tidak |
---|---|
Dapat dibatalkan: | Ya |
Jenis acara: | Peristiwa |
Tag HTML yang didukung: | <masukan> |
Versi DOM: | Acara Tingkat 3 |
Lebih Banyak Contoh
Contoh
Beri tahu beberapa teks jika bidang input berisi kurang dari 6 karakter:
Name: <input type="text" id="myInput" name="fname" pattern=".{6,}"
required>
<script>
document.getElementById("myInput").addEventListener("invalid", myFunction);
function myFunction() {
alert("Must contain 6 or more characters");
}
</script>
Contoh
Beri tahu beberapa teks jika bidang input berisi angka yang kurang dari 2 atau lebih besar dari 5:
Number: <input type="number" id="myInput" name="quantity" min="2" max="5"
required>
<script>
document.getElementById("myInput").addEventListener("invalid", myFunction);
function myFunction() {
alert("You must pick a number between 2 and 5. You chose: " + this.value);
}
</script>
Halaman Terkait
Tutorial JavaScript: Formulir JavaScript