html显⽰单⾏⽂本框表单元素有哪些，常见的表单元素有哪些？
各有什么属性？...
⼤家好，我是IT修真院北京分院第23期学员。今天⼩课堂的主要内容是，input表单的应⽤，还有在html5中新增的属性。
表单元素是允许⽤户在表单中(⽐如:⽂本域，下拉列表，单选框，复选框等等)输⼊信息的元素，最主要的作⽤就是收集信息。表单元素是页⾯中不可缺少的元素，在最新的H5中，表单元素也新增了⼀些属性，在页⾯构建中发挥了重要的作⽤。⼀般来说，表单包含如下⼏个部分：
1. 提⽰信息：表单中包含的说明性⽂字
2. 表单控件：包含了具体的表单功能项
3. 表单域：容纳所有表单控件和提⽰信息
常⽤的表单元素，包括：
1. form: 定义供⽤户输⼊的表单。
2. fieldset: 定义域。即输⼊区加有⽂字的边框。
3. legend：定义域的标题，即边框上的⽂字。
4. label：定义⼀个控制的标签。如输⼊框前的⽂字，⽤以关联⽤户的选择。
5. input: 定义输⼊域，常⽤。可设置type属性，从⽽具有不同功能。
6. textarea: 定义⽂本域(⼀个多⾏的输⼊控件)，默认可通过⿏标拖动调整⼤⼩。
7. button: 定义⼀个按钮。
8. select: 定义⼀个选择列表，即下拉列表。
9. option: 定义下拉列表中的选项。
接下来是对这些表单元素的具体分析。
……
name : 表单名称；action : ⽤来指定表单处理程序的位置(url)；method : 定义表单结果从浏览器传送到服务器的⽅式，默认为"get"(也可以是post)
name：控件名称；value:input控件默认⽂本值；size:input控件在页⾯中的显⽰宽度(必须是正整数)
input常⽤type属性如下：
1. text：单⾏⽂本输⼊框，可以通过正整数的size控制框长度。
2. password：密码输⼊框。
3. radio：单选按钮，同⼀组的单选按钮必须要有相同的name。
4. checkbox：复选框，同⼀组的单选按钮必须要有相同的name。
5. button：普通按钮。
6. submit：提交按钮，每出现⼀次，⼀个 Submit 对象就会被创建。
7. reset：重置按钮，会重置当前表单中全部的内容。
8. image：图像形式的提交按钮，写法是“”。
9. hidden：隐藏域，隐藏字段对于⽤户是不可见的。
10. file：⽂件域，⽤于⽂件上传。
选项1
……
size：下拉菜单的可见选项数；multiple：多选。
在最新的html5中，有⼀些表单的新增属性，多⽤于js，如
datalist : 定义填写⼀个input时，提⽰⼏个option⽤于提⽰。可通过input的list特性与此元素作关联。
output : 表⽰计算的结果。可通过for特性与其它能够影响运算的元素(如input)作关联。
还有⼀些新增的type属性：
html中提交表单用什么属性
1. search：input会呈现为搜索框(与text类型的唯⼀区别在于当⿏标覆盖时尾部出现叉号可快速清除输⼊的内容)。
2. tel：编辑电话号码的控件，提交时换⾏符会⾃动从输⼊框中去掉。
3. url：编辑url的控件，提交时换⾏符与⾸位的空格都将⾃动去除。
4. email：可输⼊⼀个邮件地址。
5. color : 选择颜⾊的控件。
6. date : 选择年⽉⽇的控件。
此外，还有time、datetime、datetime-local、month、week、number、range类型。
html5中input新增的⼀些较常⽤的特性：
1. list：关联datalist所⽤的该datalist的id(即datalistform外建⽴，通过list关联即可)。
2. pattern：⼀个正则表达式，⽤于检查控件的值，可作⽤于text、search、tel、url、email类型的input。
3. form：⼀个字符串(为关联的form表单的id)，⽤于表明该input属于哪个form表单(作⽤类似list)。
4. formmethod：表明使⽤GET还是POST，能覆盖form表单的method。仅在type为image或submit，且上⾯的form特性被设置的情况下才能使⽤。相似的有formtarget特性。
5. readonly：⼀个boolean值，表明该input值是否能被⽤户修改，可⽤于信息展⽰等页⾯。作⽤于type
为hidden、range、color、checkbox、radio、file、button的input将被忽略。
6. maxlength：type为text、emal、search、password、tel或url(都为⽂本)时允许输⼊的最⼤字符个数。
7. autocomplete：浏览器是否根据之前提交的输⼊情况对此input⾃动填值(即以option形式匹配之前的输⼊值)，取值on或off，默认on。如在登陆页⾯不想显⽰上⼀个登陆的⽤户名等时，可设置为off。
参考⽂献
问题整理
1. 使⽤input上传⽂件或图⽚应该怎么办
2. input为什么不使⽤闭合标签
input为⾃闭和标签，详见W3C标准
3. type="number"在输⼊框右侧有上下箭头可以加减数字，怎么去掉箭头？
使⽤type="tel"时没有右侧上下箭头。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。