html5 datalist标签的用法

来源：互联网发布：linux 还原系统时间编辑：程序博客网时间：2024/06/04 19:34

html5 datalist标签的用法

datalist介绍：
datalist一般不会独行江湖，它需要与input标签的搭配使用，就像label标签与input标签搭配使用一样。既然与input标签搭配使用，那么这两个标签之间必定存在着“特殊的关系”，不然input与datalist就互不相认了，那么如何才能让他们建立起来这种关系呢？这个时候我们需要一个新的属性list（注意，不是for），list与for的用法一样，list的值设置为表单元素的 id，这样他们便会自动关联了。

Chrome对此标签支持不好，Firefox和Opera可很好的支持

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>html5 datalist标签的用法</title></head><body><input list="w3cfuns-search" /><datalist id="w3cfuns-search">        <option value="W3C标准">        <option value="W3C规则">        <option value="W3C验证">        <option value="前端开发">        <option value="前端开发网">        <option value="2天驾驭DIV+CSS">        <option value="W3CSchool"></datalist> </body></html>

这里写图片描述

0 0