ตัวอย่าง
แจ้งเตือนข้อความบางอย่างถ้าช่องใส่ไม่ถูกต้อง:
<input type="text" oninvalid="alert('You must fill out the form!');" required> ลองตัวเอง» เพิ่มเติม "Try it Yourself" ตัวอย่างด้านล่าง
ความหมายและการใช้งาน
เหตุการณ์ oninvalid เกิดขึ้นเมื่อ submittable <input> องค์ประกอบที่ไม่ถูกต้อง
ยกตัวอย่างเช่นช่องใส่ไม่ถูกต้องถ้า required แอตทริบิวต์มีการตั้งค่าและข้อมูลที่ว่างเปล่า (คน required แอตทริบิวต์ระบุว่าช่องใส่ต้องกรอกก่อนที่จะส่งแบบฟอร์ม)
สนับสนุนเบราว์เซอร์
ตัวเลขในตารางระบุราว์เซอร์รุ่นแรกที่สนับสนุนอย่างเต็มที่เหตุการณ์
| เหตุการณ์ | |||||
|---|---|---|---|---|---|
| oninvalid | ใช่ | 10.0 | ใช่ | ได้รับการสนับสนุน | ใช่ |
วากยสัมพันธ์
ใน HTML:
ใน JavaScript:
object .oninvalid=function(){ ลองตัวเอง» ใน JavaScript โดยใช้ addEventListener() วิธีการ:
object .addEventListener("invalid", myScript );
ลองตัวเอง» หมายเหตุ: addEventListener() วิธีการที่ไม่ได้รับการสนับสนุนใน Internet Explorer 8 และรุ่นก่อนหน้านี้
รายละเอียดทางเทคนิค
| บับเบิ้ล: | ไม่ |
|---|---|
| ยกเลิก: | ใช่ |
| ประเภทเหตุการณ์: | เหตุการณ์ |
| แท็ก HTML ที่รองรับ: | <input> |
| DOM เวอร์ชัน: | ระดับที่ 3 เหตุการณ์ |
ตัวอย่างอื่น ๆ
ตัวอย่าง
แจ้งเตือนข้อความบางอย่างถ้าช่องใส่มีน้อยกว่า 6 ตัวอักษร:
Name: <input type="text" id="myInput" name="fname" pattern=".{6,}">
<script>
document.getElementById("myInput").addEventListener("invalid",
myFunction);
function myFunction() {
alert("Must contain 6 or
more characters");
}
</script> ลองตัวเอง» ตัวอย่าง
แจ้งเตือนข้อความบางอย่างถ้าช่องใส่มีตัวเลขที่น้อยกว่า 2 หรือมากกว่า 5:
Number: <input type="number" id="myInput"
name="quantity" min="2" max="5">
<script>
document.getElementById("myInput").addEventListener("invalid",
myFunction);
function myFunction() {
alert("You must pick a
number between 2 and 5. You chose: " + this.value);
}
</script> ลองตัวเอง» หน้าเว็บที่เกี่ยวข้อง
กวดวิชา JavaScript: รูปแบบ JavaScript
<object เหตุการณ์