Thẻ <select> HTML
Thí dụ
Tạo danh sách thả xuống với bốn tùy chọn:
<label for="cars">Choose a car:</label>
<select
name="cars" id="cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="mercedes">Mercedes</option>
<option value="audi">Audi</option>
</select>
Thêm các ví dụ "Hãy tự mình thử" bên dưới.
Định nghĩa và Cách sử dụng
Phần <select>
tử được sử dụng để tạo danh sách thả xuống.
Phần <select>
tử thường được sử dụng nhất trong một biểu mẫu, để thu thập thông tin đầu vào của người dùng.
Thuộc name
tính cần thiết để tham chiếu dữ liệu biểu mẫu sau khi biểu mẫu được gửi (nếu bạn bỏ qua
name
thuộc tính, sẽ không có dữ liệu nào từ danh sách thả xuống được gửi).
Thuộc id
tính này là cần thiết để liên kết danh sách thả xuống với một nhãn.
Các thẻ <option> bên trong <select>
phần tử xác định các tùy chọn có sẵn trong danh sách thả xuống.
Mẹo: Luôn thêm thẻ <label> để có các phương pháp hỗ trợ tiếp cận tốt nhất!
Hỗ trợ trình duyệt
Element | |||||
---|---|---|---|---|---|
<select> | Yes | Yes | Yes | Yes | Yes |
Thuộc tính
Attribute | Value | Description |
---|---|---|
autofocus | autofocus | Specifies that the drop-down list should automatically get focus when the page loads |
disabled | disabled | Specifies that a drop-down list should be disabled |
form | form_id | Defines which form the drop-down list belongs to |
multiple | multiple | Specifies that multiple options can be selected at once |
name | name | Defines a name for the drop-down list |
required | required | Specifies that the user is required to select a value before submitting the form |
size | number | Defines the number of visible options in a drop-down list |
Thuộc tính toàn cầu
Thẻ <select>
cũng hỗ trợ Thuộc tính chung trong HTML .
Thuộc tính sự kiện
Thẻ <select>
cũng hỗ trợ Thuộc tính sự kiện trong HTML .
Các ví dụ khác
Thí dụ
Sử dụng <select> với thẻ <optgroup>:
<label for="cars">Choose a car:</label>
<select
name="cars" id="cars">
<optgroup label="Swedish Cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
</optgroup>
<optgroup label="German Cars">
<option value="mercedes">Mercedes</option>
<option value="audi">Audi</option>
</optgroup>
</select>
Các trang liên quan
Tham chiếu DOM HTML: Chọn Đối tượng
Hướng dẫn CSS: Biểu mẫu tạo kiểu
Cài đặt CSS mặc định
Không có.