天天看点

HTML5的datalist元素

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>
           

效果图

HTML5的datalist元素

继续阅读