HTML5-表单

一、Form

1．action 属性
action 属性用于指定表单提交时向何处发送表单数据，即需要发送的服务器地址

各种表单控件

2．method 属性
method 属性用于指定表单向服务器提交数据的方法，包括两种方法，分别是 get 和post。
（1）get 方法的特点
使用 URL（统一资源定位符）传递参数：http://服务器地址？name1=value1&name2=value2，其中“?”符号表示要进行参数传递，“?”符号后面采用“name=value”的形式传递，多个参数之间，用“&”符号连接。URL 传递的数据量有限，只能传递少量数据。
PS：使用 URL 传递参数并不安全，所有信息可在地址栏中看到，并且可以通过地址栏随意传递其他数据。
（2）post 方法的特点
将数据封装后使用 http 请求传递，信息在地址栏中不可见，比较安全，并且传递的数据量理论上没有限制。
get 方法是表单提交的默认方法，但是通常采用 post 方法传递数据
3．enctype 属性
enctype 属性指定表单发送的编码方式，只有 method="post"时才有效，共有三种属性值。
1）application/x-www-form-urlencoded：此为默认值，如果 enctype 属性省略不写，则表示采取此种编码方式
2）multipart/form-data：不对字符编码，用于上传文件时使用。
3）text/plain：将空格转换为“+”符号，但不编码特殊字符，通常在将表单发送到电子邮箱时使用。

二、Input输入框

1．type 属性
type 属性表示 input 输入框的类型，它的默认值是 text。
2．name 属性
name 属性表示 input 输入框的名称，一般必填。因为传递数据时，使用“name=value”的形式传递。
3．value 属性
value 属性表示 input 输入框的默认值。

请输入内容：

4．placeholder 属性
placeholder 属性表示输入框中的提示信息，当输入框有 value 属性的时候，提示内容会消失，转而显示 value 属性值。

验证placeholder

5．tabindex 属性
tabindex=“1” 此属性控制按 Tab 键时的跳转顺序，从最小的数值开始，逐个往大的数值跳转，依次获得焦点。

三、Text文本输入框

文本输入框用于输入单行文本，默认宽度为 20 个字符。

请输入内容：

四、password：密码输入框

密码输入框输入的内容会以小黑点的形式替代显示。

密码框：

五、radio：单选按钮

单选按钮用于填写表单时信息选择，如调查问卷中的单选题

男女

name 和 value 属性需同时存在，提交时，提交的是 value 中的属性值。
例如： 提交时，显示"sex=男"。
radio 凭借 name 属性区分是否为同一组。name 相同，为同组，同组中只能选择一个。
checked=“checked” 默认选中。radio 只能选一个，checkbox 可以选多个。

六、checkbox：复选按钮

复选按钮与单选按钮相同，也用于填写表单时信息选择

爱好选择：唱歌画画跳舞

七、file：文件上传按钮

文件上传按钮用于文件上传，单击“选择文件”按钮会弹出对话框，选择需要上传的文件。

八、submit：表单提交按钮

表单提交按钮用于提交表单数据，单击按钮后，表单中用户填写的信息会被发送到表单指定的地方进行处理。当没有 value值时，submit 按钮中默认显示的文字为“提交”。

submit框：

九、reset：重置按钮

重置按钮将表单数据重置为初始状态，通常是清空表单已填内容。

十、button：可单击按钮

定义一个可单击的按钮，通常与 JavaScript一起使用来启动脚本。

十一、select 下拉选择控件

在表单中通过控件可以创建一个下拉式的列表或带有滚动条的列表，可以在列表中选中一个或多个选项，通常用于填写生日、所在地区等信息。开发人员提前设计好选项，让用户在填写信息时可以直接选择，更加方便用户使用。
1．标签的属性
1）name=“列表名”：所有选项只有一个 name。
2）multiple=“multiple”：设置 select 控件为多选，可在列表中使用 Ctrl 键+鼠标进行多选。一般不用。
3）size=“1”：规定下拉列表中可见选项的数目。如果 size 属性的值大于 1，但是小于列表中选项的总数目，下拉列表就会显示出滚动条，表示可以查看更多选项。