第2章 HTML高级应用
2.1 HTML表单
HTML表单是一个包含表单元素的区域，用于搜集不同类型的用户输入。表单元素是允许用户在表单中输入信息的元素，例如：文本域、下拉列表、单选框、复选框等。表单使用表单标签<form>定义，表单本身并不可见。
<form>标签有两个比较重要的属性：
（1）action属性——定义提交表单时执行的动作。
通常，表单会被提交到Web服务器上的网页。如果省略action属性，则action会被设置为当前页面。
（2）method属性——规定在提交表单时所用的HTTP方法（GET或者POST）。
当使用GET方式时，表单提交通常是被动的（例如搜索引擎查询），并且没有敏感信息，表单数据在页面地址栏中也是可见的。GET最适合少量数据的提交，浏览器会设定容量限制。当使用POST方式时，表单通常正在更新数据，或者包含敏感信息（例如密码）。POST的安全性更强，因为在页面地址栏中被提交的数据是不可见的。
2.1.1 HTML输入类型
常用的表单标签是输入标签<input>，输入类型是由类型属性（type）定义的。如果要正确地被提交，每个输入字段必须设置一个name属性，value属性规定输入字段的初始值，size属性规定输入字段的尺寸（以字符计）。经常被用到的输入类型如下。
1.文本域（Text Fields）
当用户要在表单中键入字母、数字等内容时，就会用到文本域。
例2-1：
在大多数浏览器中，文本域的缺省宽度是20个字符。
2.密码域（Passwords）
当用户要在表单中键入密码时，就会用到密码域。密码域中的字符会被做掩码处理。
例2-2：
3.单选按钮（Radio Button）
当用户从若干给定的选项中选取其一时，就会用到单选按钮。
例2-3：
提示：如果希望把单选按钮归类为一组，设置它们的name属性为同一个名字即可。
4.复选框（Checkbox）
当用户需要从若干给定的选项中选取一个或多个时，就会用到复选框。
例2-4：
提示：checked属性规定在页面加载时应该被预先选定的input元素。checked属性与<input type="checkbox">或者<input type="radio">配合使用。checked属性也可以在页面加载后，通过JavaScript代码进行设置。
5.创建按钮
type="button"用于定义可点击按钮。多数情况下，可以通过JavaScript启动脚本。type="reset"用于定义重置按钮，重置按钮会清除表单中的所有数据。
例2-5：
6.表单的动作属性和提交按钮
向服务器提交表单的通常做法是使用提交按钮。当用户单击提交按钮时，表单的内容会被传送到另一个文件。表单的动作属性（Action）定义了目的文件的文件名，由动作属性定义的这个文件通常会对接收到的输入数据进行相关的处理。
例2-6：
假如在上面的文本框内键入几个字母，然后点击提交按钮，那么输入数据会传送到"login.jsp"的页面。
7.文件域
在设计用户注册表单的时候，经常会涉及用户头像之类的上传。这时可以用一个<input type="file"/>定义输入字段和“浏览”按钮，供文件上传。
8.隐藏域
<input type="hidden"/>用于定义隐藏字段，隐藏字段对于用户是不可见的。隐藏字段通常会存储一个默认值，它们的值也可以由JavaScript进行修改。
9.图像域
<input type="image"/>用于定义图像形式的提交按钮。
2.1.2 下拉列表框
下拉列表框是一个可选列表。select元素可以创建单选或者多选菜单，<select>元素中的<option>标签用于定义列表中的可用选项。
例2-7：
提示：如果想要创建带有预选值的下拉列表，可在<option>标签中使用selected="selected"属性。
2.1.3 文本域
用户可以在文本域中写入文本，且可写入字符的字数不受限制。<textarea>标签用于定义多行的文本输入控件。
例2-8：
2.1.4 Button元素
<button>元素用于定义可点击的按钮。例如：
<button type="button"onclick="alert('Hello World!')">Click Me!</button>
2.1.5 用<fieldset>组合表单数据
在form表单中，可以对表单中的信息进行分组归类。例如用户注册表单，可以将注册信息分为两部分：
·基本信息（一般为必填）。
·详细信息（一般为可选）。
那么如何更好地来实现呢？可以考虑在表单form中加入下面两个标签：
·<fieldset>元素用于分组，组合表单中的相关数据。
·<legend>元素为每组<fieldset>元素定义标题。
2.1.6 表单实例
例2-9：个人表单信息
例2-10：从表单发送电子邮件
