sự kiện không hợp lệ
Ví dụ
Cảnh báo một số văn bản nếu trường nhập không hợp lệ:
<input type="text" oninvalid="alert('You must fill out the form!');" required>
Hãy tự mình thử »Thêm ví dụ "Hãy tự mình thử" bên dưới.
Sự miêu tả
Sự kiện không hợp lệ xảy ra khi phần tử <input> có thể gửi không hợp lệ.
Ví dụ: trường đầu vào không hợp lệ nếu thuộc tính bắt buộc được đặt và trường trống (thuộc tính bắt buộc chỉ định rằng trường đầu vào phải được điền trước khi gửi biểu mẫu).
Hỗ trợ trình duyệt
Các số trong bảng chỉ định phiên bản trình duyệt đầu tiên hỗ trợ đầy đủ sự kiện.
Event | |||||
---|---|---|---|---|---|
oninvalid | Yes | 10.0 | Yes | Yes | Yes |
Cú pháp
Trong JavaScript, sử dụng phương thức addEventListener():
object .addEventListener("invalid", myScript );
Hãy tự mình thử »Chi tiết kỹ thuật
Bong bóng: | KHÔNG |
---|---|
Có thể hủy: | Đúng |
Loại sự kiện: | Sự kiện |
Thẻ HTML: | <đầu vào> |
Phiên bản DOM: | Sự kiện cấp 3 |
Thêm ví dụ
Ví dụ
Cảnh báo một số văn bản nếu trường nhập chứa ít hơn 6 ký tự:
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>
Hãy tự mình thử »Ví dụ
Cảnh báo một số văn bản nếu trường nhập chứa số nhỏ hơn 2 hoặc lớn hơn 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>
Hãy tự mình thử »Trang liên quan
Hướng dẫn JavaScript: Biểu mẫu JavaScript