HTML datalist标签

本文概述

• HTML数据列表标记示例
• 支持的浏览器

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>

立即测试

输出：

输入你喜欢的板球运动员：按任意字符

支持的浏览器