คุณสมบัติ form ของ HTML DOM Select ใช้คืนค่าการอ้างอิงของฟอร์มที่มีรายการแบบเลื่อนลง
รูปแบบไวยากรณ์ (Syntax)
object.form
ตัวอย่าง
ตัวอย่างการใช้งานคุณสมบัติ form ของ HTML DOM Select:
<!DOCTYPE html> <html> <head> <style> body{ text-align:center; background-color:#363946; color:#fff; } form{ margin:2.5rem auto; border:1px solid #fff; padding:2rem; } .drop-down{ display:block; width:35%; border:2px solid #fff; font-weight:bold; padding:2px; margin:1rem auto; outline:none; } button{ background-color:#db133a; border:none; cursor:pointer; padding:8px 16px; color:#fff; border-radius:5px; font-size:1.05rem; outline:none; } .show{ font-weight:bold; font-size:1.4rem; } </style> </head> <body> <h1>ตัวอย่างคุณสมบัติ form</h1> <form id="Form 1"> <legend style="font-weight:bold;">Form 1</legend> <p>สวัสดีครับ โปรดเลือกวิชาที่คุณชอบ:</p> <select class='drop-down' name="Drop Down List"> <option>ฟิสิกส์</option> <option>คณิตศาสตร์</option> <option>เคมี</option> <option>ภาษาอังกฤษ</option> <option>เศรษฐศาสตร์</option> <option>ภาษาฮินดี</option> <option>ชีววิทยา</option> </select> </form> <button onclick="identify()">ระบุฟอร์มของรายการแบบเลื่อนลง</button> <p class="show"></p> <script> function identify() { var formId = document.querySelector(".drop-down").form.id; document.querySelector(".show").innerHTML = "สวัสดี! ผมมาจาก " + formId; } </script> </body> </html>
ผลลัพธ์
โค้ดด้านบนจะให้ผลลัพธ์ดังนี้:
คลิกปุ่ม 「ระบุฟอร์มของรายการแบบเลื่อนลง」 เพื่อระบุฟอร์มที่อ้างอิงถึงรายการแบบเลื่อนลง:
