Thẻ datalist trong HTML
- 15-12-2021
- Trung Minh
- 0 Comments
Thẻ <datalist> có chức năng chỉ định một danh sách các tùy chọn được xác định trước cho một phần tử <input>.
Thẻ <datalist> được sử dụng để cung cấp chức năng “autocomplete” cho các phần tử <input>, người dùng sẽ thấy một danh sách thả xuống các tùy chọn trước khi họ nhập dữ liệu.
Sử dụng thuộc tính list của thẻ <input> kết hợp với thuộc tính id của thẻ <datalist> để ràng buộc.
Cách sử dụng thẻ <datalist>
Ví dụ: Sử dụng thẻ <datalist> để tạo danh sách tùy chọn trước cho thẻ input.
<!DOCTYPE html>
<html>
<head>
<title>Học lập trình miễn phí tại web888.vn</title>
<meta charset="utf-8">
</head>
<body>
<h1>Học lập trình miễn phí tại web888.vn</h1>
<form action="/action_page.php" method="get">
<input list="browsers" name="browser">
<datalist id="browsers">
<option value="Internet Explorer">
<option value="Firefox">
<option value="Chrome">
<option value="Opera">
<option value="Safari">
</datalist>
<input type="submit">
</form>
</body>
</html>
Thuộc tính của thẻ <datalist>
Thẻ <datalist> được cung cấp toàn bộ các thuộc tính Global Attributes in HTML.