重走HTML之HTML表单

表单

什么是表单

<form></form>表单标签主要是用于与Web应用程序进行数据的交互，它只允许用户用户将数据发送给Web应用程序，网页也可以拦截数据的发送以便自己使用。form元素通常由一到多个表单控件组成，这些表单控件有单行/多行文本框，下拉菜单，按钮，复选框，单选按钮，使用表单控件时，一般要配合label标签，用于描述其目的，<form></form>标签可用属性如下:

• action 用于处理表单信息的应用程序的地址。
• method 浏览器用来提交表单的HTTP方法，常用的有get/post方法

get 对应Http协议的GET方法，表单数据被附加在url上，使用"?"分隔
post 对应于Http协议的POST方法，表单数据包含在HTTP协议的请求报文的体部。

• name 设置表单的名称
• target 表示浏览器接受到form的提交信息后在哪里显示回应。

_self,_blank,_parent,_top

• enctype属性设定表单数据的内容类型

1. application/x-www-form-urlencoded 在发送前编码所有字符(默认)使用到的编码方式有：
   (1)控件的名称和值都被转义，空白字符使用"+"替换，保留的字符一般都是用来实现特定的目的。
   (2)控件的“名称/值”对按照它们在文档数据流中出现的顺序出来。“名称”“值”使用“=”分隔，两个“名称/值”之间使用&隔开。(查询字符串)
2. multipart/form-data 不对字符编码。在使用包含文件上传控件的表单时，必须使用该值。
3. text/plain 空格转换未“+”加号，但不对特殊字符编码。

表单控件

Input表单控件

Input组件用于接受来自用户的数据，其可用属性如下：
type 属性用于设定组件类型:

• text 单行文本框
• password 密码框，输入的内容将会被遮挡。
• checkbox 复选框，必须使用value属性来描述该组件所提交的值，使用checked属性，默认选中。
• radio 单选按钮，必须使用value属性来描述该组件所提交的值，使用checked属性默认选中。一个单选按钮中所有组件都应该具有相同的name值，这样，每次只能选中某个按钮组中的某一个组件
• submit 提交按钮
• reset 重置按钮
• file 文件按钮，该组件用于选中系统中的某个文件
• hidden 隐藏域，该组件不显示在页面中，但是其值会被提交。
• image 图像按钮，必须使用src来加载图片，使用alt来声明替换文本。
• button 普通按钮
  input组件用于接受来自用户的数据，其可用属性如下：
• name 用于设定控件名和提交数据的属性名
• value 用于 控件值初始化，可选
• checked 单选框，复选框默认选中属性
• disabled 表示禁用组件，禁用组件的值也不能被提交
• size 当前控件的初始宽度，这个宽度以像素为单位。除非控件类型时text，password，这时宽度时整数值，表示祖父的数目，默认为20
• maxlength 指定可用输入的字符的最大值。适用于控件类型为text，password。

fieldset组件

fieldset组件用于在一个web表单中对多个控件和标签进行分组，其属性如下：

• disabled 禁用filedset元素，该属性会影响的fieldset的子元素
• name fieldset元素的名称
  fieldset的标题由标签提供

button表单组件

按钮组件，其可用属性如下:

type 指定控件类型 ，其取值可以为button，submit，reset
name 按钮名称

label表单组件

label 用于表示某一表单组件的标题

• for 与为设定标题的表单组件的ID值一致。效果就是我们点击该label控件时，鼠标会聚焦到for对应到的ID的控件

select表单组件

select用于表示下拉列表或列表，其可用属性如下:

• multiple 指定控件类型。布尔类型的值，表示是否允许多选，如果select元素不包含属性size和属性multiple时，表达类型显示为菜单(组合框),如果使用了属性size和属性multiple中任意一个，则表示表单类型显示为列表框
• size 显示的行数
• disabled 表示禁用组件，禁用组件的值也不能被提交
• name 用于指定该组件的名字，会与其option子元素的value值组成键值对随其他表单数据一齐被提交

option表单组件

option用于表示选项，常包含在<select>,<optgroup>中,，其可用属性如下:

• disabled 表示禁用组件，禁用组件的值也不能被提交
• value 定义控件的初始值。提交表单时，初始值会被提交给服务器
• selected 表示该选项默认被选中

optgroup表单组件

optgroup用于表示包含option的选项组，常包含在<select>中,其可用属性有:

• disabled 表示禁用组件，禁用组件的值也不能被提交
• label 表示选项组的名称

textarea

texxtarea用于表示多行文本框，没有value属性，其值被包含在标签内。其可用属性如下：

• rows 定义文本框的行数
• cols 定义文本框的列数
• wrap 表示是否自动换行，其值可以为off 表示不自动换行，hard自动硬回车换行，换行元素一同被传送到服务器中，soft 自动软回车换行，换行元素不会传到服务器中
• disabled 表示禁用组件，禁用组件的值也不能被提交
• readonly 表示该组件只读，其值依然会被提交
• name 用于指定该组件的名字，会随着其值一同被提交到后台