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

คุณสมบัติ disabled ของ input type="reset" ใช้ตั้งค่าหรือดึงค่า ว่าปุ่ม reset ควรปิดใช้งานหรือไม่ ใช้ boolean: true = ปิดใช้งาน, false = ใช้งานได้ (ค่าเริ่มต้น) ปุ่มที่ disabled จะเป็นสีเทาและคลิกไม่ได้

ไวยากรณ์ (Syntax)

การตั้งค่า disabled:

resetObject.disabled = true|false

หมายเหตุ: ต้นฉบับเขียน resetObject.autofocus ผิด — ถูกต้องคือ resetObject.disabled

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

<!DOCTYPE html>
<html>
<body>
<h1>คุณสมบัติ disabled ของ Input Reset</h1>
<form 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>คลิกปุ่ม DISABLE เพื่อปิดการใช้งานปุ่ม reset</p>
<button type="button" onclick="disableReset()">ปิดใช้งาน</button>
<p id="Sample"></p>
<script>
  function disableReset() {
    document.getElementById("RESET1").disabled = true;
    document.getElementById("Sample").innerHTML = "ปุ่ม reset ถูกปิดใช้งานแล้ว";
  }
</script>
</body>
</html>

ผลลัพธ์

เริ่มต้น: ฟอร์มมีช่องข้อความ 2 ช่อง และปุ่ม Reset ใช้งานได้

หลังคลิก "ปิดใช้งาน": ปุ่ม Reset กลายเป็นสีเทา กดไม่ได้ และข้อความยืนยันแสดง

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

• ฟอร์มมี input type="reset" id="RESET1" — กดแล้วจะล้างข้อมูลฟอร์ม
• ปุ่ม "ปิดใช้งาน" เรียก disableReset()
• ตั้งค่า .disabled = true ทำให้ปุ่ม reset ไม่ทำงาน

การใช้งาน: ป้องกันผู้ใช้กด reset โดยไม่ตั้งใจ หลังกรอกข้อมูลมานาน — สามารถเปิดใช้งานกลับได้ด้วย .disabled = false เมื่อพร้อม