码农教程 - 一技在手,衣食无忧! tools

HTML <datalist> 标签

❮上一节 完整的 HTML参考 下一节❯

示例

具有预定义选项的数据列表（连接到 <input> 元素）：

<label for="browser">Choose your browser from the list:</label>
<input list="browsers" name="browser" id="browser">

<datalist id="browsers">
  <option value="Edge">
  <option value="Firefox">
  <option value="Chrome">
  <option value="Opera">
  <option value="Safari">
</datalist>
亲自试一试 »

定义和用法

这个<datalist>标签指定 <input> 元素的预定义选项列表。

这个<datalist>标签用于为 <input> 元素提供 "autocomplete" 功能。用户输入数据时将看到预定义选项的下拉列表。

这个<datalist>元素的 id 属性必须等于 <input> 元素的 list 属性（这将它们绑定在一起）。

浏览器支持

表中的数字指定完全支持该元素的第一个浏览器版本。

Element
<datalist> 20.0 10.0 4.0 12.1 9.5

全局属性

这个<datalist>标签还支持HTML 中的全局属性。

事件属性

这个<datalist>标签还支持HTML 中的事件属性。

相关页面

HTML DOM 参考：数据列表对象

默认 CSS 设置

大多数浏览器都会显示<datalist>具有以下默认值的元素：

datalist {
  display: none;
}


❮上一节 完整的 HTML参考 下一节❯