sự kiện oninvalid
Thí 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>
Thêm các ví dụ "Hãy tự mình thử" bên dưới.
Định nghĩa và Cách sử dụng
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 HTML:
<element oninvalid="myScript">
Trong JavaScript:
object.oninvalid = function(){myScript};
Trong JavaScript, sử dụng phương thức addEventListener ():
object.addEventListener("invalid", myScript);
Lưu ý: Phương thức addEventListener () không được hỗ trợ trong Internet Explorer 8 và các phiên bản trước đó.
Chi tiết kỹ thuật
Bong bóng: | Không |
---|---|
Có thể hủy bỏ: | Đúng |
Loại sự kiện: | Biến cố |
Các thẻ HTML được hỗ trợ: | <input> |
Phiên bản DOM: | Sự kiện cấp 3 |
Các ví dụ khác
Thí dụ
Cảnh báo một số văn bản nếu trường nhập có í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>
Thí dụ
Cảnh báo một số văn bản nếu trường nhập chứa một 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>
Các trang liên quan
Hướng dẫn JavaScript: Biểu mẫu JavaScript