แอตทริบิวต์ disabled ขององค์ประกอบ <option> ใช้สำหรับ ปิดใช้งานตัวเลือก ในรายการ (select/datalist) ตัวเลือกที่ disabled จะ คลิกไม่ได้ และ ไม่ถูกส่งไปกับฟอร์ม
ไวยากรณ์ (Syntax)
<option disabled>
ตัวอย่างการใช้งาน
<!DOCTYPE html>
<html>
<body>
<h2>ระดับสิ่งปนเปื้อนของน้ำ</h2>
<p>ระดับสิ่งปนเปื้อน <meter min="0" low="50" high="95" max="100" value="85"></meter></p>
<select>
<optgroup label="อัตราส่วน">
<option value="one">3:2</option>
<option value="two" disabled>5:3</option>
</optgroup>
<optgroup label="น้ำ">
<option value="low">2 ลิตร</option>
<option value="medium">5 ลิตร</option>
<option value="high">10 ลิตร</option>
<option value="veryhigh">20 ลิตร</option>
</optgroup>
</select>
</body>
</html>
ผลลัพธ์
ตัวเลือก "5:3" ภายใต้กลุ่ม "อัตราส่วน" จะเป็นสีเทาและเลือกไม่ได้
คำอธิบายโค้ด
- ใช้
<optgroup>จัดกลุ่มตัวเลือก <option value="two" disabled>5:3</option>— ตัวเลือกที่ 2 ถูก disabled- ผู้ใช้ไม่สามารถเลือก "5:3" ได้
การใช้งานจริง: ใช้เมื่อบางตัวเลือกไม่พร้อมใช้งานชั่วคราว (เช่น สินค้าหมดสต็อก, ฟีเจอร์ที่ยังไม่เปิดให้บริการ) แต่ยังต้องการแสดงให้เห็นว่ามีตัวเลือกนี้อยู่
รองรับ: ทุกเบราว์เซอร์สมัยใหม่ รวมถึง mobile browsers