Categories HTML

Thẻ datalist trong HTML

Ví dụ

Một phần tử <input> với các giá trị được định nghĩa trước trong <datalist>:

<input list="browsers">

<datalist id="browsers">
<option value="Internet Explorer">
<option value="Firefox">
<option value="Chrome">
<option value="Opera">
<option value="Safari">
</datalist>

Kết quả:


Định nghĩa và cách dùng

Thẻ <datalist> chỉ định một danh sách lựa chọn được định nghĩa trước cho phần tử <input>.

Thẻ <datalist> sử dụng tính năng “autocomplete – tự động điền” cho phần tử <input>. Người dùng sẽ thấy danh sách lựa chọn xổ xuống khi họ nhập dữ liệu.

Sử dụng thuộc tính list (danh sách) của phần tử input để ràng buộc nó cùng với phần tử <datalist>.


Trình duyệt hỗ trợ

Các con số trong bảng chỉ ra phiên bản trình duyệt đầu hỗ trợ đầy đủ cho thẻ .

Thẻ  Chrome  IE  FireFox  Safari  Opera
<datalist> 20.0 10.0 4.0 Không hỗ trợ 9.0

Sự khác nhau giữa HTML 4.01 và HTML5

Thẻ <datalist> là thẻ mới trong HTML5.

Thiết lập CSS mặc định

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

datalist {
display: none;
}
Back to Top