本文概述
HTML <datalist>标记用于在表单元素上提供自动完成功能。它提供了预定义选项的列表, 供用户选择数据。
datalist标记是在HTML5中引入的。
<datalist>标记应与包含<list>属性的<input <元素一起使用。 “列表”属性的值与数据列表ID关联。
HTML数据列表标记还支持全局和事件属性。
HTML数据列表标记示例
让我们看一下HTML5数据列表标记的简单示例。如果按A, 它将显示以A字母开头的板球运动员列表。
<label>
Enter your favorite cricket player: Press any character<br />
<input type="text" id="favCktPlayer" list="CktPlayers">
<datalist id="CktPlayers">
<option value="Sachin Tendulkar">
<option value="Brian Lara">
<option value="Jacques Kallis">
<option value="Ricky Ponting">
<option value="Rahul Dravid">
<option value="Shane Warne">
<option value="Rohit Sharma">
<option value="Donald Bradman">
<option value="Saurav Ganguly ">
<option value="AB diVilliers">
<option value="Mahendra Singh Dhoni">
<option value="Adam Gilchrist">
</datalist>
</label>
立即测试
输出:
输入你喜欢的板球运动员:按任意字符
支持的浏览器
Element | Chrome | IE | Firefox | Opera | Safari |
<datalist> | Yes | Yes | Yes | Yes | Yes |