hẻ datalist trong HTML - Các thẻ HTML
Code RUN <!DOCTYPE html> <html> <head> <title>Học lập trình miễn phí tại Zaidap.com.net</title> <meta charset="utf-8"> </head> <body> <h1>Học lập trình miễn phí tại Zaidap.com.net</h1> ...
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 Zaidap.com.net</title>
<meta charset="utf-8">
</head>
<body>
<h1>Học lập trình miễn phí tại Zaidap.com.net</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.
Trình duyệt hỗ trợ
- Chrome 20.0
- Firefox 4.0
- IE 10.0
- Opera 9.0
Tham khảo: w3schools.com
Nguồn: Zaidap.com.net