input标签主要用于Web表单的创建交互，以便接受来自用户的数据。 我们通过更改type属性的值，来实现不同的输入类型。在以前的写法中表单元素必须放在form元素所包含的里面，而在html5中，我们可以把它们写在页面上的任何一个地方，只需要给该元素增加一个form属性，form属性的值为form表单的id。例如：
<form method="get" id="test">
<input type="text" name="name"/>
<input type="password" name="password"/>
<input type="submit" value="提交">
</form>
<input type="text" name="confirm" form="test">html5新增表单属性
color：用于指定颜色的控件。
date：用于输入日期的控件（年，月，日，不包括时间）。
datetime：基于 UTC 时区的日期时间输入控件（时，分，秒及几分）。
datetime-local：用于输入日期时间控件，不包含时区。
email：用于编辑 e-mail 的字段。 合适的时候可以使用 :valid 和 :invalid css 伪类。
month：用于输入年月的控件，不带时区。
number: 用于输入浮点数的控件。
range：用于输入不精确值控件。如果未指定相应的属性，控件使用如下缺省值： min：0 max：100 value：min + (max-min)/2，或当 max 小于 min 时使用。
search：用于输入搜索字符串的单行文本字段。换行会被从输入的值中自动移除。
tel：用于输入电话号码的控件；换行会被自动从输入的值中移除A，但不会执行其他语法。可以使用属性，比如 pattern 和 maxlength 来约束控件输入的值。恰当的时候，可以应用 :valid 和 :invalid css 伪类。
time：用于输入不含时区的时间控件。
url：用于编辑URL的字段。换行会被自动从输入值中移队。可以使用如：pattern 和 maxlength 样的属性来约束输入的值。 恰当的时候使可以应用 :valid 和 :invalid CSS 伪类。
week：用于输入一个由星期-年组成的日期，日期不包括时区。
使用上述属性的时候，当在表单提交，和触发填写时候，支持html5的浏览器会提示类型是否正确，如果没有设置novalidate属性当输入不正确是无法提交的。不支持的将以默认属性"text"。
html5新增form 属性
autocomplete： 属性规定输入字段是否应该启用自动完成功能。自动完成允许浏览器预测对字段的输入。当用户在字段开始键入时，浏览器基于之前键入过的值，应该显示出在字段中填写的选项。<form autocomplete="on|off">
novalidate :属性规定当提交表单时不对其进行验证。如果使用该属性，则表单不会验证表单的输入。<form novalidate="novalidate">
input 属性
| 属性 | 值 | 描述 |
|---|---|---|
| accept | mime_type | 规定通过文件上传来提交的文件的类型。 |
| align |
| 不赞成使用。规定图像输入的对齐方式。 |
| alt | text | 定义图像输入的替代文本。 |
| autocomplete |
| 规定是否使用输入字段的自动完成功能。 |
| autofocus | autofocus | 规定输入字段在页面加载时是否获得焦点。 （不适用于 type="hidden"） |
| checked | checked | 规定此 input 元素首次加载时应当被选中。 |
| disabled | disabled | 当 input 元素加载时禁用此元素。 |
| form | formname | 规定输入字段所属的一个或多个表单。 |
| formaction | URL | 覆盖表单的 action 属性。 （适用于 type="submit" 和 type="image"） |
| formenctype | 见注释 | 覆盖表单的 enctype 属性。 （适用于 type="submit" 和 type="image"） |
| formmethod |
| 覆盖表单的 method 属性。 （适用于 type="submit" 和 type="image"） |
| formnovalidate | formnovalidate | 覆盖表单的 novalidate 属性。 如果使用该属性，则提交表单时不进行验证。 |
| formtarget |
| 覆盖表单的 target 属性。 （适用于 type="submit" 和 type="image"） |
| height |
| 定义 input 字段的高度。（适用于 type="image"） |
| list | datalist-id | 引用包含输入字段的预定义选项的 datalist 。 |
| max |
| 规定输入字段的最大值。 请与 "min" 属性配合使用，来创建合法值的范围。 |
| maxlength | number | 规定输入字段中的字符的最大长度。 |
| min |
| 规定输入字段的最小值。 请与 "max" 属性配合使用，来创建合法值的范围。 |
| multiple | multiple | 如果使用该属性，则允许一个以上的值。 |
| name | field_name | 定义 input 元素的名称。 |
| pattern | regexp_pattern | 规定输入字段的值的模式或格式。 例如 pattern="[0-9]" 表示输入值必须是 0 与 9 之间的数字。 |
| placeholder | text | 规定帮助用户填写输入字段的提示。 |
| readonly | readonly | 规定输入字段为只读。 |
| required | required | 指示输入字段的值是必需的。 |
| size | number_of_char | 定义输入字段的宽度。 |
| src | URL | 定义以提交按钮形式显示的图像的 URL。 |
| step | number | 规定输入字的的合法数字间隔。 |
| type |
| 规定 input 元素的类型。 |
| value | value | 规定 input 元素的值。 |
| width |
| 定义 input 字段的宽度。（适用于 type="image"） |
在下面的案例中，我们对一些常用的属性做了解释:
<body>
<!--
placeholder:用于在文本框未输入时提示作用
autofocus:用于控件自动获取焦点
-->
<input type="search" name="key" value="" results="s" placeholder="君乐宝" autofocus="true">
<input type="button" name="" value="搜索"><br>
<!--
novalidate:在控件中加入了required、emial、url等验证后，如果想让这些验证失效，可以在表单中将novalidate设置为tyue
-->
<form action="upload.php" method="post" accept-charset="utf-8" id="form1" novalidate="true">
<!--
required:必填
autocomplete:在网页的文本框中输入部分内容或者双节时，经常会看到在下面显示输入过的内容，
这就是html5的新特性：自动完成，如果不想使用此功能，将其设置为off即可
-->
<input type="text" name="UserName" value="" required autocomplete="off"><br>
<!--
multiple:在选择文件时，默认只能单选，加上这个属性后，则可以使用鼠标选中多个文件进行上传
-->
<label>选择文件</label>
<input type="file" name="upload" value="" multiple="multiple"><br>
<!--
list：这个属性要和datalist元素一起使用，指定此文本框的可选择项，另外其相较于select的优点在于还可以输入
-->
<label>区号：</label>
<input type="text" name="age" value="" list="list1"><br>
<datalist id="list1">
<option value="0312">保定</option>
<option value="0311">石家庄</option>
<option value="010">北京</option>
<option value="0313">唐山</option>
</datalist>
<!--
formaction:可以更改点击此按钮式提交到服务器的处理程序
formmethod:可以更改向服务器提交数据的方式
-->
<input type="submit" name="subsave" value="提交">
<input type="submit" name="subresset" value="更改" formaction="1.php" formmethod="get">
</form>
</body>完结~~~~~~~~~~~~~
关闭
阻止表单的默认提交事件
表单一点击提交按钮(submit)必然跳转页面，如果表单的action为空也会跳转到自己的页面，即效果为刷新当前页。 如下，可以看到一点击提交按钮
vue2表单验证组件_vee-validate的使用教程
vee-validate基于vue2的表单验证组件，这篇文章主要讲解它的安装，引用，基础使用，内置的校验规则，自定义校验规则。Validator是以$validator被组件自动注入到Vue实例的，同时也可以独立的进行调用
Validate表单验证插件之异步操作
使用ajax方式进行验证某个元素的值(只是验证元素的值，而不是ajax方式提交表单)，默认会提交当前验证的值到请求的地址，如果要提交其它的值，可以使用data选项。
input输入限制只能为数字
input输入限制只能为数字的2种方法，通过onkeypress事件和onkeyup事件，输不上任何非数字字符。加上正则匹配不能输入非数字字符就可以了
form 表单中 disabled 属性的元素不参与表单提交
当上述两种写法出现时，表单提交的数据中，将不包括 age 这个属性，这是因为 input 被设置为了 disabled。若想将 age 属性随 form 表单提交，个人推荐解决办法是不设置 disabled，改为 readonly，具体参照 W3C 的规范。
如何禁止浏览器自动保存密码表单？
为了帐号和密码安全，作为程序员，如何不让浏览器自动记住密码呢？浏览器有时总是自动填充用户和密码，怎么屏蔽呢？ 方法一：在输入框上添加 onfocus=this.type=password 输入框获得焦点时改变输入框格式为密码框
HTML常用标签之<form>标签
在HTML中，<form></form>标记对用来创建一个表单，即定义表单的开始和结束位置，在标记对之间的一切都属于表单的内容。每个表单元素开始于form元素，可以包含所有的表单控件
PHP如何解决表单重复提交
表单隐藏域中存放session（表单被请求时生成的标记）。采用此方法在接收表单数据后，检查此标志值是否存在，先进行删除，然后处理数据; 若不存在，说明已提交过，忽略本次提交。加载提交的页面时候
js如何获取checkbox被选中的值?
通过复选框的name属性,遍历后将被选中的复选框的值输出：checkbox[index].nextSibling.nodeValue: 获取的是checkbox中标签包裹的文本值，建立一个数组,使用push 方法将被选中的元素保存到数组
layui在form表单不回调的问题
在使用layui进行ajax表单提交时，不回调，并且刷新了当前页面。在表单提交后添加 代码 return false;form.on()表单监控事件中一定要加 return false;
内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!