คุณสมบัติ readOnly ของ HTML DOM Input Search ใช้สำหรับตั้งค่าหรือส่งคืนว่าช่องค้นหาเป็น read-only หรือไม่ คุณสมบัติ readOnly ทำให้องค์ประกอบไม่สามารถแก้ไขได้ แต่ยังสามารถโฟกัสได้ด้วยแท็บหรือคลิก หากมีค่าเริ่มต้นในองค์ประกอบ read-only จะถูกส่งไปยังเซิร์ฟเวอร์เมื่อ submit
ไวยากรณ์
ไวยากรณ์สำหรับการตั้งค่าคุณสมบัติ readOnly:
searchObject.readOnly = true|false
ที่นี่ true แทนว่าช่องค้นหาเป็น read-only ในขณะที่ false แทนตรงข้าม คุณสมบัติ readOnly ตั้งค่าเป็น false โดยค่าเริ่มต้น
ตัวอย่าง
มาดูตัวอย่างสำหรับคุณสมบัติ readOnly ของ Search:
<!DOCTYPE html> <html> <body> <h1>Search readOnly property</h1> <form> FRUITS: <input type="search" id="SEARCH1" name="fruits"> </form> <p>เปลี่ยนคุณสมบัติ readOnly ของช่องด้านบนโดยคลิกปุ่มด้านล่าง</p> <button onclick="changeRead()">CHANGE</button> <script> function changeRead() { document.getElementById("PASS1").readOnly = true; } </script> </body> </html>
ผลลัพธ์
จะได้ผลลัพธ์ดังนี้:
เมื่อคลิกปุ่ม CHANGE:
