Form表单

form表单作用

向浏览器提交一些需要传递的数据。

常用input标签

1. 提交类
   <button>、<input type="submit">，注意<input type="button">不会提交表单。

2. 输入类

<input type="text">//默认单行输入
<textarea></textarea>//文本输入框，可多行输入，设置宽高```

3. 选择类：必须设置`value`

单选，`name`值必须一致，不一致无法单选

<input type="radio" name="sex" value="男"> 男
<input type="radio" name="sex" value="女"> 女

多选，`name`值必须一致。

<input type="checkbox" name="hobby" value="read"> 读书
<input type="checkbox" name="hobby" value="music"> 听歌
<input type="checkbox" name="hobby" value="study"> 学习

下拉菜单，`selected `默认选择。

<select name="city">
<option value="beijing">北京</option>
<option value="shanghai" selected>上海</option>
<option value="hangzhou">杭州</option>
</select>

4. 其他

label，标签，提示作用

<label for="password">密码</label>//配合text使用，点击lalel时，光标自动选中与"for"属性一致的输入框
<input id="password" type="password" name="password" placeholder="输入密码">

reset，重置所有输入框

<input type="reset" value="Reset" /> 重置输入

file，文件上传

<input type="file" name="myfile" accept="image/png">
//只接受png格式图片上传

hidden，用户无法看见的输入框

<input type="hidden" name="csrf" value="12345623fafdffdd">
//1.暂存一些东西 2.安全方面，用于校验

## POST与GET
GET一般用于获取、查询资源信息，而POST一般用于更新资源信息。

根据HTTP规范，GET用于信息获取，而且应该是安全的和幂等的 。

这里的安全的意味着该操作用于获取信息而非修改信息。换句话说，GET请求一般不应产生副作用。就是说，它仅仅是获取资源信息，就像数据库查询一样，不会修改，增加数据，不会影响资源的状态。幂等的意味着对同一URL的多个请求应该返回同样的结果。

根据HTTP规范，POST表示可能修改变服务器上的资源的请求 。

1.提交方式区别  
- GET提交，请求的数据会附在URL之后（就是把数据放置在请求行（request line）中），以?分割URL和传输数据，多个参数用&连接；例如：login.action?name=hyddd&password=idontknow&verify=%E4%BD%A0 %E5%A5%BD。Url的编码格式采用的是ASCII码，而不是Unicode，这也就是说你不能在Url中包含任何非ASCII字符，所有非ASCII字符均需要编码再传输。

- POST提交：把提交的数据放置在是HTTP包的包体中。

**因此，GET提交的数据会在地址栏中显示出来，而POST提交，地址栏不会改变。**

2.传输数据大小
首先声明：HTTP协议没有对传输的数据大小进行限制，HTTP协议规范也没有对URL长度进行限制。
- GET:特定浏览器和服务器对URL长度有限制，例如IE对URL长度的限制是2083字节(2K+35)。对于其他浏览器，如Netscape、FireFox等，理论上没有长度限制，其限制取决于[操作系统](http://lib.csdn.net/base/operatingsystem)的支持。

**因此对于GET提交时，传输数据就会受到URL长度的限制。**

- POST:由于不是通过URL传值，理论上数据不受限。但实际各个WEB服务器会规定对post提交数据大小进行限制，Apache、IIS6都有各自的配置。

3.安全性
- POST的安全性要比GET的安全性高。注意：这里所说的安全性和上面GET提到的“安全”不是同个概念。上面“安全”的含义仅仅是不作数据修改，而这 里安全的含义是真正的Security的含义，比如：通过GET提交数据，用户名和密码将明文出现在URL上，因为登录页面有可能被浏览器缓存。

- 其他人查看浏览器的历史纪录，那么别人就可以拿到你的账号和密码了，除此之外，使用GET提交数据还可能会造成Cross-site request forgery攻击。

## input name的作用
传输数据时，name的值即为键值对中的“键”值，若没有键值，服务器根本不知道你发过去的是什么。

## placeholder 
占位符，其提示作用，不会作为数据被发送到服务器。

## type=hidden
表单隐藏域是指在表单form内声明一个type类型为hidden的input标签，用来传递数据和做一些其它的功能。它的优点是提供了一种往form中存取数据的方法。 
### 作用
- 隐藏域在页面中对于用户是不可见的，在表单中插入隐藏域的目的在于收集或发送信息，以利于被处理表单的程序所使用。浏览者单击发送按钮发送表单的时候，隐藏域的信息也被一起发送到服务器。

- 有些时候我们要给用户一信息，让他在提交表单时提交上来以确定用户身份，如sessionkey，等等．当然这些东西也能用cookie实现，但使用隐藏域就简单的多了。而且不会有浏览器不支持，用户禁用cookie的烦恼。
- 有些时候一个form里有多个提交按钮，怎样使程序能够分清楚到底用户是按那一个按钮提交上来的呢？我们就可以写一个隐藏域，然后在每一个按钮处加上 `onclick="document.form.command.value='xx'"`然后我们接到数据后先检查command的值就会知道用户是按的那个按钮提交上来的。

参考资料：
1.[GET与POST的区别](http://blog.csdn.net/gideal_wang/article/details/4316691)
2.[表单隐藏域的应用](http://for-dream.iteye.com/blog/1570279)