คุณสมบัติแบบฟอร์มรีเซ็ตอินพุต HTML DOM ใช้สำหรับส่งคืนการอ้างอิงแบบฟอร์มที่มีปุ่มรีเซ็ตที่กำหนด หากปุ่มรีเซ็ตอยู่นอกแบบฟอร์ม ปุ่มจะคืนค่าเป็น NULL คุณสมบัตินี้เป็นแบบอ่านอย่างเดียว
ไวยากรณ์
ต่อไปนี้เป็นไวยากรณ์สำหรับการป้อนข้อมูล รีเซ็ตคุณสมบัติของแบบฟอร์ม
resetObject.form
ตัวอย่าง
ให้เราดูตัวอย่างคุณสมบัติการรีเซ็ตอินพุต -
<!DOCTYPE html> <html> <body> <h1>Input reset form Property</h1> <form id="FORM_1" style="border:solid 2px green;padding:2px"> UserName: <input type="text" id="USR"> <br> Location: <input type="text" id="Age"> <br><br> <input type="reset" id="RESET1"> </form> <p>Get the form id by clicking on the below button</p> <button type="button" onclick="formId()">GET FORM</button> <p id="Sample"></p> <script> function formId() { var P=document.getElementById("RESET1").form.id; document.getElementById("Sample").innerHTML = "The id of the form containing the reset button is: "+P ; } </script> </body> </html>
สิ่งนี้จะสร้างผลลัพธ์ต่อไปนี้ -
เมื่อคลิกปุ่ม GET FORM -
ในตัวอย่างข้างต้น −
เราได้สร้าง องค์ประกอบที่มี type=”reset”, id=”RESET1” การคลิกที่ปุ่มนี้จะรีเซ็ตข้อมูลในแบบฟอร์ม ปุ่มนี้อยู่ในแบบฟอร์มที่มีช่องข้อความสองช่อง และแบบฟอร์มยังมีรูปแบบอินไลน์ที่ใช้อยู่ด้วย
<form style="border:solid 2px green;padding:2px"> UserName: <input type="text" id="USR"> <br> Location: <input type="text" id="Age"> <br><br> <input type="reset" id="RESET1"> </form>
จากนั้นเราได้สร้างปุ่ม GET FORM ที่จะรันเมธอด formId() เมื่อผู้ใช้คลิก
<button type="button" onclick="formId()">GET FORM</button>
เมธอด formId() ใช้เมธอด getElementById() เพื่อรับฟิลด์อินพุตที่มีการรีเซ็ตประเภท และรับคุณสมบัติ id ของอ็อบเจ็กต์ฟอร์มที่มีปุ่มรีเซ็ต จากนั้นกำหนดค่านี้ให้กับตัวแปร P และแสดงในย่อหน้าด้วย id "ตัวอย่าง" โดยใช้คุณสมบัติ innerHTML -
function formId() { var P=document.getElementById("RESET1").form.id; document.getElementById("Sample").innerHTML = "The id of the form containing the reset button is: "+P ; }