<datalist>

版本：HTML5

HTML<datalist>元素包含了一组<option>元素，这些元素表示其它表单控件可选值.

浏览器支持


IE 10、Firefox、Opera 和 Chrome 支持<datalist>标签。
注释：IE 9 和更早版本的 IE 浏览器以及 Safari 不支持`<datalist>`标签。

示例

<label>choose a browser from this list:
<input list="browsers" name="mybrowser" /></label>
<datalist id="browsers">
 <option value="chrome">
 <option value="firefox">
 <option value="internet explorer">
 <option value="opera">
 <option value="safari">
</datalist>

choose a browser from this list:

定义和用法

<datalist>标签定义可选数据的列表。

标签定义及使用说明

<datalist>标签规定了<input>元素可能的选项列表。与<input>元素配合使用，就可以制作出输入值的下拉列表。
<datalist>标签被用来在为<input>元素提供"自动完成"的特性。用户能看到一个下拉列表，里边的选项是预先定义好的，将作为用户的输入数据。
请使用<input>元素的list属性来绑定<datalist>元素。

内容分类	流式内容元素，段落内容
允许的内容	段落内容，0个或多个`<option>`元素
标签省略	开始标签和结束标签都不能省略。
允许的父元素	任何接受段落内容的元素
允许的ARIA角色	None
DOM接口	`HTMLDataListElement`

属性

属性	值	描述
data	value	供自动插入数据。

HTML 4.01 与 HTML 5 之间的差异

<datalist>标签是 HTML 5 中的新标签。

全局属性

<datalist>标签支持HTML的全局属性。

事件属性

<datalist>标签支持HTML的事件属性。

例子

<input id="mycar" list="cars" />
<datalist id="cars">
  <option value="bmw">
  <option value="ford">
  <option value="volvo">
</datalist>

下面是一个<input>元素，<datalist>中描述了其可能的值：

<input list="browsers">
<datalist id="browsers">
	<option value="internet explorer">
	<option value="firefox">
	<option value="chrome">
	<option value="opera">
	<option value="safari">
</datalist>