看书《DIV+CSS商业案例与网页布局开发精讲》_制作列表和表单2_随手笔记

二、表单

1、表单是网站与用户交互的一座桥梁，通过表单，可以将用户在网页上输入的信息提交到后台数据库，使得信息得以交流。

在网站中表单的应用非常广泛，从最简单的采集访问者的名字和调查表再到留言簿，

甚至到复杂的博客系统及电子购物系统都大量应用了表单来采集提交的数据

2、一个完整的表单在结构上由3部分组成：表单标签、表单域和表单按钮

表单基本结构：

<form>

表单域

<input name="表单按钮" type="button" id="表单按钮">

</form>

说明：

（1）表单标签：其中包括处理表单数据所用CGI程序的URL以及数据提交到服务器的方法

（2）表单域：包括文本框、密码框、隐藏域、多行文本框、复选框、单选按钮、下拉选择框和文件域等

（3）表单按钮：包括提交按钮、复位按钮和一般按钮，用于将数据传送到服务器上的CGI脚本或者取消输入，

还可以用表单按钮来控制其他定义了处理脚本的处理工作

注：

对于表单按钮，还可以使用<button>表单按钮名称</button>

3、表单中用到的标记很多，除固定的表单域的声明标签外，还有比如文本框、密码框、多行文本框、

单选按钮、复选框、下拉选择框和文本域等表单域和一些按钮

（1）表单标签：<form></form>

用于声明表单，定义采集数据的范围，所谓表单的数据传输也就是把<form>和</form>中的数据提交到服务器或者电子邮件中

（2）文本框：<input type="text" />

文本框是一种让访问者自己输入内容的表单对象，通常用来填写单个字或者简短的回答，如姓名、地址等

（3）密码框：<input type="password" />

密码框是一种特殊的文本域，用于输入密码。当访问者输入文字时，文字会被星号或其他符号代替，因此输入的文字会被隐藏

（4）隐藏域：<input type="hidden" />

隐藏域是用来收集或发送信息的不可见元素，对于网页的访问者来说，隐藏域是看不见的。

当表单被提交时，隐藏域就会将信息用你设置时定义的名称和值发送到服务器上

（5）单选按钮：<input type="radio" />

单选按钮是用来制作只有唯一的答案的选择区

（6）复选框：<input type="checkbox" />

复选框允许在待选项中选中一项以上的选项。每个复选框都是一个独立的元素，都必须有一个唯一的名称

（7）多行文本框：<textarea>

多行文本框主要用于输入较长的内容，其作用非常广泛，例如现在流行的博客系统，它的内容录入部分就是使用了多行文本框

（8）下拉选择框：<select>

下拉选择框是提供一种固定数据的选择模式，在下拉选择框中提供了预先设置好的多项内容，供访问者选择其中一项

（9）文件域：<input type=""file />

其作用是提供用户上传本地文件的接口，文件域的上传框看上去和文本域类似，但它还包含了一个“浏览”按钮，可以通过单击“浏览按钮”浏览本地文件。

访问者可以输入需要上传的文件的路径，也可以单击“浏览”按钮，选择需要上传的文件

（10）提交按钮：<input type="submit" />

提交按钮用来将输入的信息提交到服务器

（11）复位按钮：<input type="reset" />

复位按钮用来重置表单

（12）一般按钮：<input type="button" />

一般按钮用来控制其他定义了处理脚本的处理工作