แอตทริบิวต์ disabled ของ HTML <input>

แอตทริบิวต์ disabled ขององค์ประกอบ <input> ใช้สำหรับ ปิดใช้งาน input element Element ที่ disabled จะ คลิกไม่ได้, พิมพ์ไม่ได้, โฟกัสไม่ได้ และ จะไม่ถูกส่งไปกับฟอร์ม เมื่อ submit

ไวยากรณ์ (Syntax)

<input disabled>

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

<!DOCTYPE html>
<html>
<body>
<h2>รายละเอียด</h2>
<form>
  <p>นี่คือรายละเอียดใหม่...</p>
  <fieldset>
    <legend>รายละเอียดใหม่:</legend>
    ผู้เล่น: <input type="text" disabled><br>
    อันดับ: <input type="number"><br>
    อีเมล: <input type="email"><br>
    เวลารายงาน: <input type="time">
  </fieldset>
</form>
</body>
</html>

ผลลัพธ์

ช่อง "ผู้เล่น" จะเป็นสีเทาและปิดใช้งาน — พิมพ์ไม่ได้, โฟกัสไม่ได้

ช่องอื่นๆ (อันดับ, อีเมล, เวลา) ใช้งานได้ปกติ

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

มี input 4 ช่อง: text, number, email, time
ช่องแรก <input type="text" disabled> — เพิ่มแอตทริบิวต์ disabled (boolean attribute)
ช่องที่ disabled จะไม่ส่งค่าไปเซิร์ฟเวอร์เมื่อ submit ฟอร์ม

ความแตกต่าง disabled vs readonly:

คุณสมบัติ	disabled	readonly
โต้ตอบได้ไหม	ไม่ได้ (คลิก/พิมพ์/โฟกัส ไม่ได้)	ไม่ได้พิมพ์ แต่โฟกัสได้
ส่งค่ากับฟอร์ม	ไม่ส่ง	ส่ง
รูปลักษณ์	สีเทา muted	ปกติ
CSS selector	`:disabled`	`:read-only`

JavaScript: เข้าถึงได้ผ่าน inputElement.disabled = true/false