แท็ก <optgroup> ใน HTML ใช้สำหรับจัดกลุ่มตัวเลือกที่เกี่ยวข้องภายในรายการเลือก (select list) ทำให้ผู้ใช้เข้าใจตัวเลือกง่ายขึ้นเมื่อมีรายการมาก
แอตทริบิวต์ของ <optgroup>
| แอตทริบิวต์ | ค่า | คำอธิบาย |
|---|---|---|
| disabled | disabled | ปิดใช้งานกลุ่มตัวเลือก ผู้ใช้เลือกไม่ได้ ข้ามใน Tab order |
| label | Text | กำหนดป้ายกำกับ (label) สำหรับกลุ่ม (จำเป็น) |
ตัวอย่าง
คุณสามารถลองรันโค้ดต่อไปนี้เพื่อสร้างกลุ่มตัวเลือกใน HTML:
<!DOCTYPE html>
<html>
<head>
<title>HTML optgroup Tag</title>
</head>
<body>
<select>
<optgroup label="ประเทศไทย">
<option value="bangkok">กรุงเทพมหานคร</option>
<option value="chiangmai">เชียงใหม่</option>
</optgroup>
<optgroup label="ญี่ปุ่น">
<option value="tokyo">โตเกียว</option>
<option value="osaka">ออซาก้า</option>
</optgroup>
</select>
</body>
</html>
หมายเหตุ: <optgroup> ไม่สามารถซ้อนกันได้ (nested optgroups not allowed)
