HTML之表单form

form表单有什么作用？有哪些常用的input 标签，分别有什么作用？

• 表单的作用的收集输入相关信息，通过表单提交到后台
• 常见的input标签
  在input标签下的type属性中，我们可以选择 text、password、button、submit、reset、CheckBox、radio、file、image、hidden从而确定input元素的类型

1. text
   <input type="text" />用户可以输入单行的文本字段
2. password
   <input type="password" />用户可以输入密码
3. checkbox&radio
   <input type="checkbox&radio" />分别作为复选和单选框，需要注意的是，由于是以name为分组依据的，所以要合理设置name的值，对于value值也应赋值清楚，否则提交后台会以on形式表示，避免造成困惑
4. submit&reset&button
   这是一组按钮，分别是提交、重置、自定义按钮
   submit是向服务器发送表单数据，数据会发送到表单action属性中制定的页面中去；
   reset是将表单中的数据全部清空；
   button会在触发时启动用户自定义的js程序；<input type="button" value="start" onclick="start()" />
5. file&image
   file用于文件上传；
   image定义图像形式的提交按钮如果 type 属性设置为 image，当用户单击图像时，浏览器将以像素为单位，将鼠标相对于图像边界的偏移量发送到服务器，其中包括从图像左边界开始的水平偏移量，以及从图像上边界开始的垂直偏移量。
6. hidden
   定义隐藏字段。隐藏字段对于用户是不可见的。隐藏字段通常会存储一个默认值，它们的值也可以由 JavaScript 进行修改。

post 和 get 方式的区别？

• 关于post
  首先浏览器将与action属性中指定的表单处理服务器建立联系 ，随后将以分段传输的方法将数据发给服务器。在服务器端，一旦 POST 样式的应用程序开始执行时，就应该从一个标志位置读取参数，而一旦读到参数，在应用程序能够使用这些表单值以前，必须对这些参数进行解码。用户特定的服务器会明确指定应用程序应该如何接受这些参数。
• 关于get
  浏览器会与表单处理服务器建立连接，然后直接在一个传输步骤中发送所有的表单数据：浏览器会将数据直接附在表单的 action URL 之后。这两者之间用问号进行分隔。

图片.png（转自http://www.w3school.com.cn/tags/att_form_method.asp）

在input里，name 有什么作用？

name 属性用于对提交到服务器后的表单数据进行标识，或者在客户端通过 JavaScript 引用表单数据。只有设置了 name 属性的表单元素才能在提交表单时传递它们的值。

radio 如何 分组?

在input标签下对name属性进行归类设置，以属性值做为分组依据，同属性值为一组。

placeholder 属性有什么作用？

placeholder 属性提供可描述输入字段预期值的提示信息（hint）。该提示会在输入字段为空时显示，并会在字段获得焦点时消失。placeholder 属性适用于以下的 <input> 类型：text, search, url, telephone, email 以及 password。

type=hidden隐藏域有什么作用? 举例说明

1. 隐藏域在页面中对于用户是不可见的，在表单中插入隐藏域的目的在于收集或发送信息，以利于被处理表单的程序所使用。浏览者单击发送按钮发送表单的时候，隐藏域的信息也被一起发送到服务器。

2. 有些时候我们要给用户一信息，让他在提交表单时提交上来以确定用户身份，如sessionkey，等等．当然这些东西也能用cookie实现，但使用隐藏域就简单的多了．而且不会有浏览器不支持，用户禁用cookie的烦恼。

3. 有些时候一个form里有多个提交按钮，怎样使程序能够分清楚到底用户是按那一个按钮提交上来的呢？我们就可以写一个隐藏域，然后在每一个按钮处加上onclick="document.form.command.value="xx""然后我们接到数据后先检查command的值就会知道用户是按的那个按钮提交上来的。

4. 有时候一个网页中有多个form，我们知道多个form是不能同时提交的，但有时这些form确实相互作用，我们就可以在form中添加隐藏域来使它们联系起来。

5. javascript不支持全局变量，但有时我们必须用全局变量，我们就可以把值先存在隐藏域里，它的值就不会丢失了。

6. 还有个例子，比如按一个按钮弹出四个小窗口，当点击其中的一个小窗口时其他三个自动关闭．可是IE不支持小窗口相互调用，所以只有在父窗口写个隐藏域，当小窗口看到那个隐藏域的值是close时就自己关掉。
   [参考]