首页 > 代码库 > 08 H5新增input元素
08 H5新增input元素
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>HTML5</title>
</head>
<body>
在android和ios中尤其能体现这些输入控件的特点，会自动切换到不同的虚拟键盘！
<hr>
<form>
查询文本框
<input type="search" placeholder="请输入查询关键字" autofocus>
<hr>
列表提示
<input type="text" list="searchlist">
<datalist id="searchlist">
<option value="http://www.mamicode.com/beijing" label="北京" />
<option value="http://www.mamicode.com/shanghai" label="上海" />
<option value="http://www.mamicode.com/nanjing" label="南京" />
<option value="http://www.mamicode.com/nanchang" label="南昌"/>
</datalist>
<hr>
数字文本框
<input type="number" max="9" min="0" step="1"/>
<hr>
滑动条
<input type="range" max="9" min="0" step="1" value="http://www.mamicode.com/2">
<hr>
颜色文本框
<input type="color" value="http://www.mamicode.com/#ff00ff"/>
<hr>
电话文本框
<input type="tel">
<hr>
网址输入
<input type="url">
<hr>
邮箱地址
<input type="email">
<hr>
日期选择
<input type="date" max="2012-10-10" min="2001-01-01" value="http://www.mamicode.com/2011-01-01" />
<hr>
时间选择
<input type="time" max="18:39:57" min="17:49:57" value="http://www.mamicode.com/17:49:58" />
<hr>
UTC日期时间
<input type="datetime" />
<hr>
本地日期时间
<input type="datetime-local" />
<hr/>
<input type="submit" value="http://www.mamicode.com/submit"/>
<p>H5中新增的input元素只有在点击提交按钮时，才有效果</p>
</form>
</body>
</html>
08 H5新增input元素
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。