dtatlist元素铺助文本框的输入功能,他本身是隐藏的,与表单文本框中的list属性绑定,即可将list属性值设置为datalist的ID号,类似于suggest组件。
具体代码如下:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<form action="#">
<fieldset>
<legend>请输入你的职业</legend>
<input type="text"list="worklist" />
<datalist id="worklist">
<option value="程序员开发"></option>
<option value="系统架构师"></option>
<option value="运维工程师"></option>
</datalist>
</fieldset>
</form>
</body>
</html>
效果图
![](https://img.laitimes.com/img/_0nNw4CM6IyYiwiM6ICdiwiIyVGduV2QvwVe0lmdhJ3ZvwFM38CXlZHbvN3cpR2Lc1TPB10QGtWUCpEMJ9CXsxWam9CXwADNvwVZ6l2c052bm9CXUJDT1wkNhVzLcRnbvZ2LcZXUYpVd1kmYr50MZV3YyI2cKJDT29GRjBjUIF2LcRHelR3LcJzLctmch1mclRXY39DN5EjNxkDMwETNyQDM2EDMy8CX0Vmbu4GZzNmLn9Gbi1yZtl2Lc9CX6MHc0RHaiojIsJye.jpg)