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