网页设计与制作使用教程第11章

注：插入单选钮的HTML代码为＜INPUT type="radio" name="..." value="..."＞ 选中该单选钮，在属性面板中进行相应的属性设置
单选按钮：该名称是存储该域的值（选定值）的变量 名，必须在该表单内唯一。要保证数据的准确采集， 单选钮都是以组为单位使用的，在同一组中的单选钮 必须用同一个名称。 选定值：定义该单选钮的值。当选中该单选钮时，此 “选定值”就随表单一起提交，作为该单选钮的当前 值。 初始状态：在浏览器中首次载入该表单时该单选钮的 状态。如果选择“已勾选”，则该单选钮一加载就是 选中状态
注：多个复选框可以共用一个名称，一个复选框名称变量也可以 拥有多个值（多个值在提交时用逗号隔开）。多个复选框可以共用一 个名称时，被选中的多个复选框的值将作为该复选框名称变量的当前 值提交到服务器
（4）单选钮 单选钮允许用户在待选项中选择唯一的答案。 在新建的表单内点击鼠标，确定插入位置，然后点击插入 面板上的按钮 ，插入一单选钮
注意：1. 如果要处理表单数据，我们需要在服务器端（
即放置网页的远程计算机上）编写程序（如ASP程序）， 这部分内容已经超出了本书的范围，有兴趣的同学可以 参考其他的动态网页编程的书籍，后面我们只是对多种 动态网页技术做个简单的介绍。
2．具体使用哪种数据发送方式取决于服务器类型，可以 询问管理员来决定。如果方式任意，默认是Get方法，大 部分HTML设计者偏好使用Post方法。
，所输入的文本被替换为星号或项目符号，以隐藏该文 本，保护这些信息不被看到。

当文本框的类型设置为“多行”时，属性面板发生变 化，即文本框从“文本字段”变为“文本区域” 其属性设置和“单行”类型相似，只是更新了2个属性

（2）隐藏域


隐藏域是用来收集或发送信息的不可见元素，对 于网页的访问者来说，隐藏域是不可见的。当表单被 提交时，隐藏域就会将信息用你建立时定义的名称和 值发送到服务器。隐藏域一般用作搜集特定信息以及 在网页间传递参数等。 在新建的表单内点击鼠标，确定插入位置，然后点 击插入面板上的按钮 ，插入一隐藏域
3 .表单
通过前面的介绍，相信大家对表单有了初 步的了解。接下来我们将逐步并详细的介绍表 单的创建、编辑和应用。 1．Form标签 如果要在网页中添加表单域，应首先添加表 单，即定义表单的数据采集的范围。 （1）表单的创建 在插入面板上选择“表单”标签，点击 按钮 ，表单将插入到页面中
插入表单后效果如图

选中该“列表/菜单”域，在属性面板中进行相应的属 性设置。
列表/菜单：该名称是存储该域的值（选定值）的变量名，必须 在该表单内唯一。 类型：类型有2个可选值： 菜单：用户只能从多个预设值中选择一个值，并且该菜 单域只占一个选项的高度。
列表：用户可以从多个预设值中选择一个或者多个值，由“ 选定范围”决定。该列表域的可以同时显示多个选项，其值由“ 高度”值决定，单位为一个选项的高度。
注意： 1．插入表单的HTML语法为： ＜FORM Action="URL" Method="GET|POST" Enctype="MIME类型" TARGET="..."＞ . . .（表单元素） ＜/FORM＞ 2．FORM标签不能嵌套，即表单不能嵌套。
（2）表单的属性设置 在页面中选中表单（如果不能选中整个表单，可以在页 面的左下侧点击 中的 “<form>”实现表单的快速选 择），在属性面板中出现表单的属性选项
虽然用服务器端程序处理表单数据是通用的方法， 但是当我们只需要收集简单的信息时，而不需要及时完 成交互时，我们可以采用电子邮件的方式传送表单信息 。方法为：将“动作”属性设置为“mailto：E-Mail邮箱 名”，“方法”属性设置为“Post”，同时将“MIME类 型”属性设置为“multipart/form-data MIME”。具体效果 读者可以自行尝试。

（5）列表/菜单 列表/菜单”域允许用户在一个有限的空间内 设置多个选项，并且可以从中选择一个或者多 个选项。其功能和单选钮/复选框类似。 在新建的表单内点击鼠标，确定插入位置，然 后点击插入面板上的按钮 ，插入一“列表/菜 单”域
注：插入列表的HTML代码为 ＜select name=“...” size=“..." multiple＞ ＜option value="..." selected＞...＜/option＞ ... ＜/select＞
提交表单：在单击该按钮时，将表单获得的数据送出，以便 服务器的处理程序完成数据的处理。 重设表单：在单击该按钮时，重设表单，使所有表单域的当 前 值恢复到初始值。 无：在单击该按钮时，根据处理脚本激活一种操作
4. 实例：建立表单

1.实例创意 2.制作步骤
1．实例创意 表单是实现用户和网页交换信息的工具，但是表单效 果的实现一般需要结合相应的动态网页处理程序。当 我们在表单内填写好有关信息后，点击提交按钮，表 单会按照一定的编码方式把搜集到的数据送出，供表 单“动作”属性所指明的动态网页来进行数据的处理 。目前我们还没有涉及到动态网页的相关知识，为了 理解表单数据提交的形式和数据搜集的结果，本例通 过把表单数据提交到邮箱来进行此过程的模拟
注：插入文本框的HTML代码为： ＜input type="text" name="..." size="..." maxlength="..." value="..."＞
文本域：文本框的名称。该名称是存储该域的值（输入 的数据）的变量名，必须在该表单内唯一。 字符宽度：指定文本框的最大长度，即该表单域一次最 多可显示的字符数。默认宽度是20个字符。 最大字符数：限定用户可在文本域中输入的最大字符数 。如果保留为空，则可以输入任意数量的文本。如果字 符个数超过域的字符宽度，文本将滚动显示。如果用户 输入超过最大字符数，则表单将产生警告声。 初始值：文本框中默认显示的文本，即该表单一加载就 显示的文本。
注：插入提交按钮的HTML代码为<input type=&" value="…">
选中该“按钮”域，在属性面板中进行相应的属 性设置
• 按钮名称：该名称是存储该域的值的变量名，必须在该 表单内唯一。 • 标签：在该按钮上显示的文本。 • 动作：该按钮可执行的操作。可选择的操作有：
目标（Target）：指定超链接页面目标地址。 MIME类型：指明用来把表单数据提交给服务器时的 MIME 编码类型。缺省值是“application/x-wwwform-urlencode” ，即URL编码方法，通常与 POST 方法协同使用。如果要创建文件上传域，请指定 “multipart/form-data MIME”类型。
2 .表单域的类型
HTML定义了以下类型的表单域： （1）文本框：文本框可以接受用户的输入信息。文本框 分为两种：单行文本字段、密码框和多行的文本区域 。对于任何一种文本框，所输入的文本将作为该表单 域的当前值 （2）复选框：复选框使用户可以选择信息。对于多个具 有同一名称的复选框，用户可以选中其中的一个或多 个。 （3）单选钮：单选钮与复选框类似，也用于选择信息。 但是，对于具有同一名称的多个单选钮，用户只能选 择其中一个。
动作（Action）：指定处理已提交表单数据的程序（ 能处理表单数据，一般是动态技术网页，如ASP、JSP 、PHP等）。它可以是一个URL地址或一个电子邮件地 址。 方法（Method）：指明提交表单的HTTP方法（发送 数据的方法）。可能的值为POST和GET。
提示：POST方法将表单数据作为一个数据整体发送给服 务器。发送时将数据按照一定的编码方法编码作为HTTP 内容发送。 GET方法把“名称－值”对加在动作（Action）的URL后 面并且把新的URL送至服务器，即在URL的末尾附加要向 服务器发送的消息。这是向前兼容的缺省值。通常默认 方法为GET方法。
注：插入隐藏域的HTML代码为<input name="…" type="hidden" value="…">
选中该隐藏域，在属性面板中进行相应的属性设置
隐藏区域：隐藏域的名称。该名称是存储该域的值（ 预先设置的值）的变量名，必须在该表单内唯一。 值：定义隐藏域的值，该值可以是固定值，也可以是 函数值（可变

列表值：在“列表/菜单”中显示的选项值。 单击按 钮 ，弹出“列表值”对话框，
项目标签：在列表中显示的文本。 值：用户选择该项时将发送到服务器的数据。

初始化时选定：在浏览器中首次载入该表单域时，使 列表中的某一项处于选中状态
（6）按钮 按钮分为提交按钮，重置按钮和一般按钮，它们可 以用来提交表单（把表单获取的数据送出到服务器）、 重置表单数据（使所有表单域的值恢复到初始值）和执 行预定义的脚本语句。 在新建的表单内点击鼠标，确定插入位置，然后点 击插入面板上的 的按钮，插入一按钮
通过对比，我们可以总结出典型的表单组成内容： （1）表单标签：这里面包含了处理表单数据所用程序的 URL地址和数据提交到服务器的方法。 （2）表单域：包含了文本字段、密码框、隐藏域、多行 文本区域、复选框、单选钮、下拉选择框和文件上传 框等类型。用于接受用户输入或选择的信息。 （3）表单按钮：包括提交按钮、复位按钮和一般按钮。 用于将数据传送到服务器或者取消输入，还可以用表 单按钮来控制其他脚本处理语句的处理工作
注意：提交表单的用户机器上必须使用Outlook Express
作为默认邮件客户端，否则无法正常使用。
2．表单域 表单（Form）定义了数据采集的范围，表单域则是 采集用户输入或选择的数据的接口。表单域包含文本框 、隐藏域、复选框、单选钮和菜单/列表等，下面分别讲 述这些表单域的创建方法和属性设置。 （1）文本框 文本框是一种让访问者自己输入内容的表单对象，通 常被用来填写单个字或者简短的回答，如姓名、地址等。 在新建的表单内点击鼠标，确定插入位置，然后点击 插入面板上的 按钮，插入一文本框