Html5新增input的form属性，用于指向特定form表单的id，实现input无需放在form标签之中，即可通过表单进行提交。
<FORM id=xinzeng>
…
</FORM>
<INPUT … form="xinzeng">
type新增属性：
email、URL、date、time、month、week、number、range、color
input元素的新增属性：
Autocomplete：自动完成功能.记录用户之前输入的内容，并在下次输入时自动提示完成输入。
>>> 属性值： on/off
>>> 可以在form表单上使用，对整张表单的所有控件进行自动完成的开关
也可以在input上使用，对特定输入框进行修改。
>>> 绝大部分浏览器，默认开启。
Autofocus：自动获得焦点. autofocus="autofocus",只能设置input元素自动获得焦点。
Form：所属表单。通过form表单的id，确定此input输入哪张表单。
Required：必填.required="required" 设置input必填，否则阻止提交。
Pattern：使用正则表达式验证input的模式.
数字类型
跟数字强相关的类型，其中number、range在移动端开发时，会弹出数字键盘，而range是一个范围滑动块。
<input type='number'> <!--用于比较精确的纯数字输入类型-->
<input type='range'> <!--用于不是很精确的数字范围-->
<input type='tel'> <!--用于电话号码-->
日期和时间类型
web表单常见的字段就是日期和时间，html5以此来收集这类信息
<input type='time'>
<input type='date'>
<input type='month'>
<input type='week'>
<input type='datetime'>
<input type='datetime-local'>
其他类型 ：email、url、color、search
其中一些类型在不同的设备上都会有不同的显示。
<input type='email'>
<input type='url'>
<input type='color'>
<input type='search'>
placeholder 占位符文本，以前我们用js来模拟，获得焦点的时候，文本消失，失去焦点并且内容为空时，文本重现，现在html5自带了这一项功能。
html结构：
<input id='search' type='text' placeholder='search your goods'>
如果想要修改placeholder中的文本样式，那么我们只要给浏览器设置一些样式即可，css结构：
::-webkit-input-placeholder{
color:red;
font-size:14px;
}
::-moz-placeholder{
color:red;
font-size:14px;
}
autofocus 自动聚焦,autofocus属性可以让表单在加载完成时，会有一个表单域被默认聚焦或者选中，但是尽量不要在一个页面上在多个表单域上使用autofocus,在一些低版本浏览器上会默认聚焦最后一个含有autofocus的表单域，在大多数浏览器中会聚焦第一个含有autofocus的表单域，这会造成跨浏览器的混乱。还有我们通常用空格键来滚动页面，如果页面上有autofocus的表单域会阻止这一浏览器的默认行为。
autocomplete 自动完成，很多浏览器默认提供自动完成功能，帮助用户输入上次提交过的内容，autocomplete有两个必备的条件才能够工作，一是一定要有form元素，二个是表单域上必须要有name属性和name属性值。但是，有些时候我们为了保护隐私，需要避免自动完成这项功能，我们开启和关闭这项功能，只需给它赋值on或者off ,如果不赋值，默认就是on,表示功能开启。
网友评论