Thẻ HTML <datalist>


Thí dụ

Một danh sách dữ liệu với các tùy chọn được xác định trước (được kết nối với phần tử <input>):

<label for="browser">Choose your browser from the list:</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>

Định nghĩa và Cách sử dụng

Thẻ <datalist>chỉ định danh sách các tùy chọn được xác định trước cho phần tử <input>.

Thẻ <datalist>được sử dụng để cung cấp tính năng "tự động hoàn thành" cho các phần tử <input>. Người dùng sẽ thấy danh sách thả xuống các tùy chọn được xác định trước khi họ nhập dữ liệu.

Thuộc <datalist>tính id của phần tử phải bằng thuộc tính danh sách của phần tử <input> (điều này liên kết chúng với nhau).


Hỗ trợ trình duyệt

Các số trong bảng chỉ định phiên bản trình duyệt đầu tiên hỗ trợ đầy đủ phần tử.

Element
<datalist> 20.0 10.0 4.0 12.1 9.5

Thuộc tính toàn cầu

Thẻ <datalist>cũng hỗ trợ Thuộc tính chung trong HTML .


Thuộc tính sự kiện

Thẻ <datalist>cũng hỗ trợ Thuộc tính sự kiện trong HTML .


Các trang liên quan

Tham chiếu HTML DOM: Đối tượng Datalist


Cài đặt CSS mặc định

Hầu hết các trình duyệt sẽ hiển thị <datalist>phần tử với các giá trị mặc định sau:

datalist {
  display: none;
}