HTML <option> แบบตาราง

คำหมายและการใช้งาน

<option> แท็กซ์ต์ถูกใช้เพื่อกำหนดตัวเลือกในรายการเลือก

<option> แอลลีเมนต์ที่ตั้งอยู่ในแท็กซ์ต์ <select>、<optgroup> หรือ <datalist> ภายในแอลลีเมนต์

ให้注意：<option> แท็กซ์ต์สามารถใช้โดยไม่มีคุณสมบัติใดๆ แต่คุณต้องการ value โปรพรสซึ่งบอกถึงสิ่งที่ส่งไปยังเซิร์ฟเวอร์เมื่อฟอร์มส่ง

คำเตือน：หากคุณมีรายการตัวเลือกที่ยาวมาก <optgroup> แบ่งกลุ่มตัวเลือกที่ภายในแท็กซ์ต์

ดูเพิ่มเติมที่

HTML DOM คู่มือOption วัตถุ

实例

例子 1

包含四个选项的下拉列表：

<label for="cars">请选择一个汽车品牌：</label>
<select id="cars">
  <option value="audi">奥迪</option>
  <option value="byd">比亚迪</option>
  <option value="geely">吉利</option>
  <option value="volvo">沃尔沃</option>
</select>

ทดลองด้วยตัวเอง

例子 2

在 <datalist> 元素中使用 <option>：

<label for="browser">请从列表中选择您的浏览器：</label>
<input list="browsers" name="browser" id="browser">
<datalist id="browsers">
  <option value="Edge">
  <option value="Firefox">
  <option value="Chrome">
  <option value="Opera">
  <option value="Safari">
</datalist>

ทดลองด้วยตัวเอง

例子 3

在 <optgroup> 元素中使用 <option>：

<label for="cars">请选择一个汽车品牌：</label>
<select id="cars">
  <optgroup label="中国车">
    <option value="byd">比亚迪</option>
    <option value="geely">吉利</option>
  </optgroup>
  <optgroup label="德国车">
    <option value="mercedes">奔驰</option>
    <option value="audi">奥迪</option>
  </optgroup>
</select>

ทดลองด้วยตัวเอง

ตัวแปร

ตัวแปร ค่า คำอธิบาย
disabled disabled กำหนดให้ตัวเลือกถูกบล็อก
label ข้อความ กำหนดแบบภาพของตัวเลือก
selected selected กำหนดให้เลือกตัวเลือกก่อนการโหลดหน้า
value ข้อความ กำหนดค่าที่จะส่งไปยังเซิร์ฟเวอร์

ตัวแปรทั่วไป

<option> แบบภาพยังสนับสนุน ตัวแปรที่เกี่ยวข้องกับทั่วไปใน HTML.

ตัวแปรที่เกี่ยวข้องกับเหตุการณ์

<option> แบบภาพยังสนับสนุน ตัวแปรที่เกี่ยวข้องกับเหตุการณ์ใน HTML.

การตั้งค่า CSS โดยเริ่มต้น

ไม่มี

การสนับสนุนโดยเบราเซอร์

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
สนับสนุน สนับสนุน สนับสนุน สนับสนุน สนับสนุน