คุณสมบัติ required ของ HTML DOM input Search เกี่ยวข้องกับแอตทริบิวต์ required ขององค์ประกอบ <input> คุณสมบัติ required ใช้ตั้งค่าและส่งคืนว่าจำเป็นต้องกรอกช่องค้นหาบางช่องก่อนส่งฟอร์มไปยังเซิร์ฟเวอร์หรือไม่ นี่ทำให้ฟอร์มไม่ส่งได้หากช่องค้นหาที่มีแอตทริบิวต์ required ถูกทิ้งว่างโดยผู้ใช้
ไวยากรณ์
ไวยากรณ์สำหรับการตั้งค่าคุณสมบัติ required:
searchObject.required = true|false
ที่นี่ true แทนว่าช่องค้นหาต้องถูกกรอก ในขณะที่ false แทนว่าสามารถทิ้งว่างได้ก่อนส่งฟอร์ม
ตัวอย่าง
มาดูตัวอย่างสำหรับคุณสมบัติ required ของ input search:
<!DOCTYPE html> <html> <body> <h1>Input search required property</h1> <p>ตรวจสอบว่าช่องด้านบนบังคับกรอกหรือไม่โดยคลิกปุ่มด้านล่าง</p> <form action="/Sample_page.php"> FRUITS: <input type="search" id="SEARCH1" name="fruits" required> <input type="submit"> </form> <br> <button onclick="checkReq()">CHECK</button> <p id="Sample"></p> <script> function checkReq() { var Req=document.getElementById("SEARCH1").required; if(Req==true) document.getElementById("Sample").innerHTML="The search field must be filled before submitting"; else document.getElementById("Sample").innerHTML="The search field is optional and can be left blank by the user"; } </script> </body> </html>
ผลลัพธ์
จะได้ผลลัพธ์ดังนี้:
เมื่อคลิกปุ่ม CHECK:
หาก required property ตั้งเป็น true และคลิก submit:
