Computer >> บทช่วยสอนคอมพิวเตอร์ >  >> การเขียนโปรแกรม >> HTML

คุณสมบัติ HTML DOM Input Reset form

คุณสมบัติ form ของ input type="reset" ใช้สำหรับดึงอ้างอิงฟอร์มที่บรรจุปุ่ม reset หากปุ่ม reset อยู่นอกฟอร์ม จะคืนค่า null คุณสมบัตินี้เป็น read-only

ไวยากรณ์ (Syntax)

resetObject.form

ตัวอย่างการใช้งาน

<!DOCTYPE html>
<html>
<body>
<h1>คุณสมบัติ form ของ Input Reset</h1>
<form id="FORM_1" style="border:solid 2px green;padding:2px">
  ชื่อผู้ใช้: <input type="text" id="USR"><br>
  ที่ตั้ง: <input type="text" id="Age"><br><br>
  <input type="reset" id="RESET1">
</form>
<p>คลิกปุ่มเพื่อดึง id ของฟอร์มที่บรรจุปุ่ม reset</p>
<button type="button" onclick="formId()">ดูฟอร์ม</button>
<p id="Sample"></p>
<script>
  function formId() {
    var P = document.getElementById("RESET1").form.id;
    document.getElementById("Sample").innerHTML = "ID ของฟอร์มที่บรรจุปุ่ม reset คือ: " + P;
  }
</script>
</body>
</html>

ผลลัพธ์

เริ่มต้น: ฟอร์ม id="FORM_1" มีช่องข้อความ 2 ช่อง และปุ่ม Reset

คลิก "ดูฟอร์ม": แสดง "ID ของฟอร์มที่บรรจุปุ่ม reset คือ: FORM_1"

คำอธิบายโค้ด

  • ปุ่ม Reset: type="reset", id="RESET1" — กดแล้วล้างข้อมูลฟอร์ม
  • อยู่ใน <form id="FORM_1"> พร้อม inline style
  • ปุ่ม "ดูฟอร์ม" เรียก formId() ดึง .form.id

การใช้งาน: เหมือน radio/range form property — ใช้เข้าถึงฟอร์มพาเรนต์จาก element ภายใน เพื่อ submit, reset, validate, หรือเข้าถึง element อื่นในฟอร์มเดียวกัน