2009-11-10 1
概述,表单技术可以实现浏览者与服务器
之间信息的交互传送，它是网络信息收集
处理的一种重要的方式。通过表单可以从
网络的用户端收集信息，然后将收集来的
信息经过服务器处理后再反馈给用户。
目前，有非常多的网站都在应用表单技术，
如网上调查、电子商务、留言板等页面都
能够接收浏览者输入的信息，而表单已成
为网站获取用户信息的重要手段。
第八讲 表单的应用
2009-11-10 2
表单有两个重要组成部分：
1）、由 Dreamweaver MX生成的表单页面。
2）、用于处理 浏览者在表单域中输入的信息的服务
器端的应用程序或脚本程序，如 CGI,ASP等。
浏览者在网页上看到有关表单的页面，只是供浏
览者输入信息的表单页面。当浏览者按要求在表
单中填写有关信息，单击表单的“提交”按钮之
后，表单的内容就会上传到服务器，并且由事先
编写好的 CGI或 ASP程序来处理这些信息，最后服
务器再将处理的结果发送给浏览者的浏览器。
2009-11-10 3
可见，表单的应用必须依赖服务器端脚本才
能真正发挥其功能。
下面我们要学习的是它的第一部分：重点学
习如何使用 Dreamweaver MX生成各种功
能的表单页面。
表单的主要功能是接收输入的信息。 浏览者
输入的信息是多种多样的，这些不同类别
的信息如何接收呢？ Dreamweaver MX工
具又是如何实现的呢？
2009-11-10 4
主要内容：
一、建立表单 >>>
二、向表单添加对象 >>>
三、举例说明 >>>
四、本节小结 >>>
五、作业 >>>
2009-11-10 5
一、建立表单
Dreamweaver MX为了方便用户创建表
单的各种组件（或者称之表单域对象），
把创建各种组件的快捷按钮都收集在插入
栏中的表单面板 【 Forms（ 表单） 】 中，
共有 10多个对象，我们可以通过使用这些
对象来建立各种各样的表单。
所以,用户在创建表单时，可以先打开
插入栏中的表单面板，然后再进行表单网
页的设计。
2009-11-10 6
建立表单的操作步骤：
1）、将光标置于欲插入表单的位置，
单击表单面板中的 按钮，（或者选
择主菜单中的 【 插入 】 / 【 表单 】 命
令 ），可在文档中插入表单。
2009-11-10 7
在上图的文档窗口中显示的红色虚线框
就是新插入的空白表单，如果看不到红
色虚线框，只要选择主菜单的 【 查看 】 /
【 可视化处理 】 / 【 隐藏元素 】 命令，就
可以看到虚线框了。
2）、表单属性面板中参数介绍
在文档中插入了表单对象后，单击表单
红色虚线框，或单击 HTML状态栏中的
<form>标记，系统就会弹出该表单对象
的属性面板，如下图所示：
2009-11-10 8
表单属性面板
表单属性面板的属性说明：
（ 1）,【 表单名称（ Form Name） 】,此
项为表单定义名称，输入一个能在脚本程
序（ ASP,Javascript）中引用的表单名称，
一般为英文名称，系统默认给名为 form1。
2009-11-10 9
（ 2）,【 动作 】, 在此输入一个在
服务器端处理表单信息的应用程序
的 URL，或单击 按钮来定位应用
程序。路径可以表示为：
http://www.mysite.com/application-
name/process.asp
（ 3）,【 方法 】, 指的是表单数据
传输到服务器的方法,共有以下 3项
作为选择：
2009-11-10 10
?默认：使用浏览器的默认设置将表单数据
发送到服务器。通常，默认方法为 GET 方
法。
?GET：将表单内的数据附加到 URL后面传
送给服务器。此方式有长度限制，不能超
过 8192个字符。（不要使用这种方法发送
长表单，否则可能出现数据被截断而导致
失败的处理结果。另外这种方法不安全）
?POST：用标准的数据传送方式，是在
HTTP 请求中嵌入表单数据（或者说是在网
页正文中发送表单数据）。此方式没有长
度限制，又非常安全。
2009-11-10 11
（ 4）,【 MIME类型 】, 指定对提交给服务
器进行处理的数据使用 MIME 编码类型。
默认设置 application/x-www-form-
urlencode 通常与 POST 方法协同使用。如
果要创建文件上传域，请指定
multipart/form-data MIME 类型。
（ 5）,【 目标 】, 指定一个窗口，在该窗口
中显示调用程序所返回的数据。如果命名
的窗口尚未打开，则打开一个具有该名称
的新窗口。目标值有：
2009-11-10 12
? _blank，在未命名的新窗口中打开目标文
档。
? _parent，在显示当前文档的窗口的父窗口
中打开目标文档。
? _self，在提交表单所使用的窗口中打开目
标文档。
? _top，在当前窗口的窗体内打开目标文档。
返回
2009-11-10 13
每一个表单都是通过添加各种不同的表单对
象（元素）来实现表单的功能，打开“插入
栏”浮动面板中的“表单”面板，可以看到
Dreamweaver MX系统可以使用的各个对象：
文本域,接受任何类型的字母或数字文本项。
该文本可以显示为单行、多行，对于私有信
息，也可以显示为一系列点或星号（例如，
用于保护密码）。浏览者输入文字较麻烦，
故在表单中应尽量少用，尽可能用其它表单
对象。
二、向表单添加对象
2009-11-10 14
隐藏域,表单的隐藏域在浏览时是看不到的，
浏览者也不能执行该操作，利用隐藏域可
以实现浏览器同服务器在后台不公开地交
换信息。
复选框,允许在一组选项中选择多项。用户
可以选择任意多个适用的选项。
单选按钮,代表互相排斥的选择。在某单选
按钮组（由两个或多个共享同一名称的按
钮组成）中选择一个按钮，就会取消选择
该组中的所有其他按钮。例如，用户订阅
表单可能要求您选择“男”或“女”。
2009-11-10 15
列表 /菜单,在允许用户选择多个选项的滚动列表中
显示选项值。
跳转菜单,插入一个跳转菜单，每个菜单选项都链
接到网页或文件。
图像域,使您可以在表单中插入图像。图像域可用
于生成图形化按钮。
文件域,使用户可以浏览到其计算机上的文件并将
这些文件作为表单数据上传。
按钮,在单击时执行操作。通常，这些操作包括提
交或重置表单。可以为按钮添加自定义名称或标
签，或使用预定义的“提交”或“重置”标签之
一。
2009-11-10 16
下面介绍添加各个表单对象的方法如下：
一）、文本域 ----它是表单的重要对象之一，
它的作用就是接受访问者输入的一切信息。
插入文本域操作步骤：
1）、将光标置于表单的虚线框内；
2）、单击表单面板上的 按钮，插入文
本域，如下图所示：
2009-11-10 17
3）、为了使用户准确地输入信息，可以在
文本域前输入说明文字，如下图所示：
2009-11-10 18
4）、文本域的属性面板：
? 【 文本域 】, 文本域的名称，每个文本域必须有一
个唯一的名字，这个名称最好与要输入的信息有所
联系。例如文本域中需要用呼输入他们的名字，那
么文本域的名字可以定为,name”。
? 【 字符宽度 】, 文本域的宽度，也就是文本域一次
最多显示的字符数，它可以小于最多字符数。
“字符宽度”域中指定该域最多可显示 30 个字符，
但它最多可保存 50 个字符 。
2009-11-10 19
? 【 最大字符数 】, 当文本域的类型为单行
或密码时，这个属性为最多字符，它设置
最多向文本域输入的字符数。例如，可以
用这个属性限制密码最多为 10位，地区代
码最多为 5位等。
? 【 类型 】, 文本域的类型。有 3种类型可以
选择：“单行”、“多行”、“密码”。
当向密码文本域输入密码时，这种类型的
文本的内容显示为星号，而不显示密码，
以防别人看见密码。当选择“多行”时，
文档中的文本域变为如下图所示：
2009-11-10 20
? 【 初始值 】, 如果希望在域中显示默认文
本值，请在属性检查器的“初始值”域中
输入默认文本。在用户浏览器中首次载入
此表单时，文本域中将显示此文本。例如，
通过包含说明或示例值，可以指示用户在
域中输入信息。
5）、创建多行文本域
在插入的文本域属性面板的 [类型 ]选项中选择
多行，则可创建多行文本域：
2009-11-10 21
文本域的类型设置为多行时的状态及属性面板
2009-11-10 22
注意,此时的字符宽度指的是文本域的宽
度，默认值为 20个字符，行数默认值为 2。
换行的下拉列表中共有 4项。 其中有三项，
如果单行的字符大于文本域的宽度时，那
么行中的信息自动换行，而不出现水平滚
动条。 而只有一项，如果单行的自符数大
于文本域的宽度，那么行中的信息不自动
换行，而是出现水平滚动条。
同学们上机练习时，可以选择不同的选项，
观察其功能。
6）、设置为密码文本域（演示）
2009-11-10 23
二）、单选框与复选框
在表单中输入有些信息的选择是有限的，例
如性别、婚姻等，网页设计者可以利用单选
框或复选框限制访问者的答案。
单选框 与 复选框 是表单中不同的两个对象。
单选框的特点,不论有多少选择，访问者只
能选择一项；例如性别只能选“男”或
“女”。 复选框的特点,访问者可以选择多
个选项；例如个人有多种爱好，可以同时选
择“唱歌”、“跳舞”、“打球”。
2009-11-10 24
在表单中插入 单选框 与 复选框 的操作方法：
1、插入 单选框 的操作步骤：
1）、将光标置于表单内要插入单选框的
位置。
2）、单击表单面板中的 按钮，插入单
选按钮，单选按钮一般情况下是成对出现
的，如果是多个单项，可以选择插入单选
按钮组。
如下图所示,
2009-11-10 25
在表单中插入单选按钮的状态及其属性面板
2009-11-10 26
3）、单选按钮的属性面板的参数设置：
? 【 单选按钮 】, 定义单选按钮的名字。
如果要在表单中创建多个单选按钮交互对
象，请确保每组单选按钮都具有唯一名称。
但是，如果要插入单独的单选按钮来创建
组，则必须为每个单选按钮添加标签
? 【 选定值 】, 设置若单选按钮选中，在提
交表单时单选按钮传送给服务器表单处理
程序的值，同一组单选按钮应设置不同的
值。
2009-11-10 27
? 【 初始状态 】, 设置单选按钮的初始状态是
否选中，同一组内的单选按钮只能有一个初
始状态是选中的。
4）、创建“单选按钮组”
若要将多个单选按钮作为一组插入,就可以
单击“表单”选项卡，然后单击“单选按钮
组”图标,会弹出“单选按钮组”的对
话框，在此对话框中进行需要的设置。
举例说明！
2009-11-10 28
2、插入 复选框 的操作步骤：
1）,将光标置于表单内要插入复选框的位置。
2）,单击表单面板中的 按钮，插入一个复选
框，如下图所示：
注意：复选框
在表单中都不
是单独出现，
在每个复选框
前面要添加说
明文本
2009-11-10 29
3）、选择复选框，打开上面的复选框属性面
板，其参数设置如下：
? 【 复选框 】, 定义复选框的名字。
? 【 选定值 】, 设置若复选框选中在提交表
单时复选框传送给服务器段表单处理程序
的值。
? 【 初始状态 】, 设置复选框的初始状态是
否选中。
2009-11-10 30
三）、列表 /菜单
列表 /菜单的功能与单选按钮、复选框的功
能相似，用户利用它，可限制访问者在有
限的项目中选择适当的选项。
列表 /菜单 分为 菜单 和 列表 两种形式。
? 菜单的特点,限制访问者选 一项 。
? 列表的特点,允许访问者选择 多项 。
插入列表 /菜单的操作方法：
1）、将光标置于表单内要插入该项的位置。
2）、单击对象面板的 按钮，即插入了列
表或菜单。
2009-11-10 31
如下图：选中列表 /菜单对象，
打开相应的属性面板，如下图所示：
2009-11-10 32
? 【 列表 /菜单 】, 定义列表 /菜单的名字。
? 【 类型 】, 指的是当前对象设置为下拉“
菜单”还是“列表”。
? 按钮, 单击此按钮将打开
“列表值”对话框，在这个对话框中可以
增减和修改列表 /菜单内容。每项内容都有
一个项目标签和一个值，标签将显示在浏
览器中的列表 /菜单中，当列表或菜单中的
某项内容被选中，提交表单时它对应的值
就被送到服务器端的表单处理程序，若没
有对应的值则传送标签本身。
2009-11-10 33
? 【 初始化时选定 】, 此框首先显示列表 /菜
单中的内容，然后可在此框内设置它们的初
始选择，方法是单击欲作为初始选择的项，
若类型为列表，则可初始选择多个项，若类
型为菜单，则只能初始选择一个项。
? 按钮,是“动态列表 /菜单”对话
框，允许用户用数据库或其他内容源的内容
填充列表 /菜单表单对象。
2009-11-10 34
当类型选择了列表,就有以下的参数可以设置
? 【 高度 】, 列表框中文档中的高度，,1”表
示在列表中显示一个选项。 （即是一行的
意思）
? 【 选定范围 】, 是否表允许多项选择，勾
选表示允许，否则为不允许。
? 【 初始化选定 】, 可以在设置的菜单中设
置一个文档默认显示的选项,即初始值。
2009-11-10 35
四）、按钮
网页设计者设计表单后，还要提供一个使表
单发送、复位等命令，以便访问者输入信息后，
能用该命令发送信息或修改信息。通常是使用
按钮触发命令。在网页的表单设计中，按钮有
三种基本动作：
1）、提交表单（ Submit Form）,将表单域内
的内容发送到用户指定的地址。
2）、复位表单（ Reset Form）,将表单域内的
所有表单对象（组件）的内容还原为初始值。
3）、无动作（ None）,也有称为自定义，也值
无动作。
2009-11-10 36
在表单内插入按钮的方法：
1）、将光标置于表单内欲插入按钮的位置。
2）、单击表单面板的 按钮，插入一个按
钮，如下图：
插入的
按钮
2009-11-10 37
3）、选择按钮，打开按钮属性面板如下图，
设置按钮属性参数：
? 【 按钮名称 】, 定义按钮名称。一般取名为
,Submit”。
? 【 标签（卷标） 】, 定义按钮上的文字，可
以使用中文，如“确定”、“提交”、“注
册”等。
? 【 动作 】, 设置按钮触发的动作。（有以上
三种动作选择）
2009-11-10 38
五）、跳转菜单
跳转菜单是文档中的一种下拉菜单，在下
拉菜单中列出各种能够链接到其它文档
的选项。
创建跳转菜单的操作步骤：
1）、将光标定位到插入跳转菜单的位置。
2）、选择“插入栏”中的“表单”面板中
的跳转菜单（ Jump Menu）命令按钮,
打开插入跳转菜单对话框，如下图所示：
2009-11-10 39
插入跳转菜单对话框
2009-11-10 40
3）、单击 按钮，添加一个菜单项目。
4）、选择菜单项目，使用 这两个按钮调整该
菜单项目在列表中的位置。
5）、在“文字”框中输入菜单项目的内容。
6）、在“选择时，前往的 URL”的文本框中设置该菜
单项目链接的文件。
7）、在“打开 URL”下拉列表中选择打开文档的位置。
8）、选择“选项中的第一个复选框”，将添加一个
“前往”按钮。
9）、选择第二个复选框，在改变 URL时选择菜单的
第一个选项。
10）、设置完毕单击,OK”确定。
返回
2009-11-10 41
运用上面介绍的知识，下面举例说明如何
创建表单，并且向表单添加表单对象（表
单元素）。
例题：使用表单制作一个收集访问者信息
的网页。 要求有姓名（文本框）、性别
（单选按钮）、爱好（复选框）、学历
（下拉菜单）、留言（多行文本框）、提
交、复位按钮。
三、举例说明
2009-11-10 42
本节小结
本节主要介绍了表单作用、表单的各个对象的基本
功能及创建方法，最后又通过制作一个收集访问者
信息的表单网页的实例讲解，使大家对表单的功能
加深了理解。
重点熟练掌握网页表单的创建，灵活、合理使用
表单对象以满足实际的需要。
提示,可以使用表格来设置表单的格式。不能将表
单插入另一个表单中，但是可以在一个页面中包含
多个表单。
? 在设计表单时，请记住使用描述性文本标识表单域
（表单对象），以使用户知道自己正在对什么内容
作出响应，例如，“请键入您的姓名”是要求输入
姓名信息。
2009-11-10 43
作业
1、使用表单制作一个收集访问者信息
的网页。 要求有姓名（文本框）、性
别（单选按钮）、爱好（复选框）、
学历（下拉菜单）、留言（多行文本
框）、提交、复位按钮。
2、完成书中的调查表制作。
概述,表单技术可以实现浏览者与服务器
之间信息的交互传送，它是网络信息收集
处理的一种重要的方式。通过表单可以从
网络的用户端收集信息，然后将收集来的
信息经过服务器处理后再反馈给用户。
目前，有非常多的网站都在应用表单技术，
如网上调查、电子商务、留言板等页面都
能够接收浏览者输入的信息，而表单已成
为网站获取用户信息的重要手段。
第八讲 表单的应用
2009-11-10 2
表单有两个重要组成部分：
1）、由 Dreamweaver MX生成的表单页面。
2）、用于处理 浏览者在表单域中输入的信息的服务
器端的应用程序或脚本程序，如 CGI,ASP等。
浏览者在网页上看到有关表单的页面，只是供浏
览者输入信息的表单页面。当浏览者按要求在表
单中填写有关信息，单击表单的“提交”按钮之
后，表单的内容就会上传到服务器，并且由事先
编写好的 CGI或 ASP程序来处理这些信息，最后服
务器再将处理的结果发送给浏览者的浏览器。
2009-11-10 3
可见，表单的应用必须依赖服务器端脚本才
能真正发挥其功能。
下面我们要学习的是它的第一部分：重点学
习如何使用 Dreamweaver MX生成各种功
能的表单页面。
表单的主要功能是接收输入的信息。 浏览者
输入的信息是多种多样的，这些不同类别
的信息如何接收呢？ Dreamweaver MX工
具又是如何实现的呢？
2009-11-10 4
主要内容：
一、建立表单 >>>
二、向表单添加对象 >>>
三、举例说明 >>>
四、本节小结 >>>
五、作业 >>>
2009-11-10 5
一、建立表单
Dreamweaver MX为了方便用户创建表
单的各种组件（或者称之表单域对象），
把创建各种组件的快捷按钮都收集在插入
栏中的表单面板 【 Forms（ 表单） 】 中，
共有 10多个对象，我们可以通过使用这些
对象来建立各种各样的表单。
所以,用户在创建表单时，可以先打开
插入栏中的表单面板，然后再进行表单网
页的设计。
2009-11-10 6
建立表单的操作步骤：
1）、将光标置于欲插入表单的位置，
单击表单面板中的 按钮，（或者选
择主菜单中的 【 插入 】 / 【 表单 】 命
令 ），可在文档中插入表单。
2009-11-10 7
在上图的文档窗口中显示的红色虚线框
就是新插入的空白表单，如果看不到红
色虚线框，只要选择主菜单的 【 查看 】 /
【 可视化处理 】 / 【 隐藏元素 】 命令，就
可以看到虚线框了。
2）、表单属性面板中参数介绍
在文档中插入了表单对象后，单击表单
红色虚线框，或单击 HTML状态栏中的
<form>标记，系统就会弹出该表单对象
的属性面板，如下图所示：
2009-11-10 8
表单属性面板
表单属性面板的属性说明：
（ 1）,【 表单名称（ Form Name） 】,此
项为表单定义名称，输入一个能在脚本程
序（ ASP,Javascript）中引用的表单名称，
一般为英文名称，系统默认给名为 form1。
2009-11-10 9
（ 2）,【 动作 】, 在此输入一个在
服务器端处理表单信息的应用程序
的 URL，或单击 按钮来定位应用
程序。路径可以表示为：
http://www.mysite.com/application-
name/process.asp
（ 3）,【 方法 】, 指的是表单数据
传输到服务器的方法,共有以下 3项
作为选择：
2009-11-10 10
?默认：使用浏览器的默认设置将表单数据
发送到服务器。通常，默认方法为 GET 方
法。
?GET：将表单内的数据附加到 URL后面传
送给服务器。此方式有长度限制，不能超
过 8192个字符。（不要使用这种方法发送
长表单，否则可能出现数据被截断而导致
失败的处理结果。另外这种方法不安全）
?POST：用标准的数据传送方式，是在
HTTP 请求中嵌入表单数据（或者说是在网
页正文中发送表单数据）。此方式没有长
度限制，又非常安全。
2009-11-10 11
（ 4）,【 MIME类型 】, 指定对提交给服务
器进行处理的数据使用 MIME 编码类型。
默认设置 application/x-www-form-
urlencode 通常与 POST 方法协同使用。如
果要创建文件上传域，请指定
multipart/form-data MIME 类型。
（ 5）,【 目标 】, 指定一个窗口，在该窗口
中显示调用程序所返回的数据。如果命名
的窗口尚未打开，则打开一个具有该名称
的新窗口。目标值有：
2009-11-10 12
? _blank，在未命名的新窗口中打开目标文
档。
? _parent，在显示当前文档的窗口的父窗口
中打开目标文档。
? _self，在提交表单所使用的窗口中打开目
标文档。
? _top，在当前窗口的窗体内打开目标文档。
返回
2009-11-10 13
每一个表单都是通过添加各种不同的表单对
象（元素）来实现表单的功能，打开“插入
栏”浮动面板中的“表单”面板，可以看到
Dreamweaver MX系统可以使用的各个对象：
文本域,接受任何类型的字母或数字文本项。
该文本可以显示为单行、多行，对于私有信
息，也可以显示为一系列点或星号（例如，
用于保护密码）。浏览者输入文字较麻烦，
故在表单中应尽量少用，尽可能用其它表单
对象。
二、向表单添加对象
2009-11-10 14
隐藏域,表单的隐藏域在浏览时是看不到的，
浏览者也不能执行该操作，利用隐藏域可
以实现浏览器同服务器在后台不公开地交
换信息。
复选框,允许在一组选项中选择多项。用户
可以选择任意多个适用的选项。
单选按钮,代表互相排斥的选择。在某单选
按钮组（由两个或多个共享同一名称的按
钮组成）中选择一个按钮，就会取消选择
该组中的所有其他按钮。例如，用户订阅
表单可能要求您选择“男”或“女”。
2009-11-10 15
列表 /菜单,在允许用户选择多个选项的滚动列表中
显示选项值。
跳转菜单,插入一个跳转菜单，每个菜单选项都链
接到网页或文件。
图像域,使您可以在表单中插入图像。图像域可用
于生成图形化按钮。
文件域,使用户可以浏览到其计算机上的文件并将
这些文件作为表单数据上传。
按钮,在单击时执行操作。通常，这些操作包括提
交或重置表单。可以为按钮添加自定义名称或标
签，或使用预定义的“提交”或“重置”标签之
一。
2009-11-10 16
下面介绍添加各个表单对象的方法如下：
一）、文本域 ----它是表单的重要对象之一，
它的作用就是接受访问者输入的一切信息。
插入文本域操作步骤：
1）、将光标置于表单的虚线框内；
2）、单击表单面板上的 按钮，插入文
本域，如下图所示：
2009-11-10 17
3）、为了使用户准确地输入信息，可以在
文本域前输入说明文字，如下图所示：
2009-11-10 18
4）、文本域的属性面板：
? 【 文本域 】, 文本域的名称，每个文本域必须有一
个唯一的名字，这个名称最好与要输入的信息有所
联系。例如文本域中需要用呼输入他们的名字，那
么文本域的名字可以定为,name”。
? 【 字符宽度 】, 文本域的宽度，也就是文本域一次
最多显示的字符数，它可以小于最多字符数。
“字符宽度”域中指定该域最多可显示 30 个字符，
但它最多可保存 50 个字符 。
2009-11-10 19
? 【 最大字符数 】, 当文本域的类型为单行
或密码时，这个属性为最多字符，它设置
最多向文本域输入的字符数。例如，可以
用这个属性限制密码最多为 10位，地区代
码最多为 5位等。
? 【 类型 】, 文本域的类型。有 3种类型可以
选择：“单行”、“多行”、“密码”。
当向密码文本域输入密码时，这种类型的
文本的内容显示为星号，而不显示密码，
以防别人看见密码。当选择“多行”时，
文档中的文本域变为如下图所示：
2009-11-10 20
? 【 初始值 】, 如果希望在域中显示默认文
本值，请在属性检查器的“初始值”域中
输入默认文本。在用户浏览器中首次载入
此表单时，文本域中将显示此文本。例如，
通过包含说明或示例值，可以指示用户在
域中输入信息。
5）、创建多行文本域
在插入的文本域属性面板的 [类型 ]选项中选择
多行，则可创建多行文本域：
2009-11-10 21
文本域的类型设置为多行时的状态及属性面板
2009-11-10 22
注意,此时的字符宽度指的是文本域的宽
度，默认值为 20个字符，行数默认值为 2。
换行的下拉列表中共有 4项。 其中有三项，
如果单行的字符大于文本域的宽度时，那
么行中的信息自动换行，而不出现水平滚
动条。 而只有一项，如果单行的自符数大
于文本域的宽度，那么行中的信息不自动
换行，而是出现水平滚动条。
同学们上机练习时，可以选择不同的选项，
观察其功能。
6）、设置为密码文本域（演示）
2009-11-10 23
二）、单选框与复选框
在表单中输入有些信息的选择是有限的，例
如性别、婚姻等，网页设计者可以利用单选
框或复选框限制访问者的答案。
单选框 与 复选框 是表单中不同的两个对象。
单选框的特点,不论有多少选择，访问者只
能选择一项；例如性别只能选“男”或
“女”。 复选框的特点,访问者可以选择多
个选项；例如个人有多种爱好，可以同时选
择“唱歌”、“跳舞”、“打球”。
2009-11-10 24
在表单中插入 单选框 与 复选框 的操作方法：
1、插入 单选框 的操作步骤：
1）、将光标置于表单内要插入单选框的
位置。
2）、单击表单面板中的 按钮，插入单
选按钮，单选按钮一般情况下是成对出现
的，如果是多个单项，可以选择插入单选
按钮组。
如下图所示,
2009-11-10 25
在表单中插入单选按钮的状态及其属性面板
2009-11-10 26
3）、单选按钮的属性面板的参数设置：
? 【 单选按钮 】, 定义单选按钮的名字。
如果要在表单中创建多个单选按钮交互对
象，请确保每组单选按钮都具有唯一名称。
但是，如果要插入单独的单选按钮来创建
组，则必须为每个单选按钮添加标签
? 【 选定值 】, 设置若单选按钮选中，在提
交表单时单选按钮传送给服务器表单处理
程序的值，同一组单选按钮应设置不同的
值。
2009-11-10 27
? 【 初始状态 】, 设置单选按钮的初始状态是
否选中，同一组内的单选按钮只能有一个初
始状态是选中的。
4）、创建“单选按钮组”
若要将多个单选按钮作为一组插入,就可以
单击“表单”选项卡，然后单击“单选按钮
组”图标,会弹出“单选按钮组”的对
话框，在此对话框中进行需要的设置。
举例说明！
2009-11-10 28
2、插入 复选框 的操作步骤：
1）,将光标置于表单内要插入复选框的位置。
2）,单击表单面板中的 按钮，插入一个复选
框，如下图所示：
注意：复选框
在表单中都不
是单独出现，
在每个复选框
前面要添加说
明文本
2009-11-10 29
3）、选择复选框，打开上面的复选框属性面
板，其参数设置如下：
? 【 复选框 】, 定义复选框的名字。
? 【 选定值 】, 设置若复选框选中在提交表
单时复选框传送给服务器段表单处理程序
的值。
? 【 初始状态 】, 设置复选框的初始状态是
否选中。
2009-11-10 30
三）、列表 /菜单
列表 /菜单的功能与单选按钮、复选框的功
能相似，用户利用它，可限制访问者在有
限的项目中选择适当的选项。
列表 /菜单 分为 菜单 和 列表 两种形式。
? 菜单的特点,限制访问者选 一项 。
? 列表的特点,允许访问者选择 多项 。
插入列表 /菜单的操作方法：
1）、将光标置于表单内要插入该项的位置。
2）、单击对象面板的 按钮，即插入了列
表或菜单。
2009-11-10 31
如下图：选中列表 /菜单对象，
打开相应的属性面板，如下图所示：
2009-11-10 32
? 【 列表 /菜单 】, 定义列表 /菜单的名字。
? 【 类型 】, 指的是当前对象设置为下拉“
菜单”还是“列表”。
? 按钮, 单击此按钮将打开
“列表值”对话框，在这个对话框中可以
增减和修改列表 /菜单内容。每项内容都有
一个项目标签和一个值，标签将显示在浏
览器中的列表 /菜单中，当列表或菜单中的
某项内容被选中，提交表单时它对应的值
就被送到服务器端的表单处理程序，若没
有对应的值则传送标签本身。
2009-11-10 33
? 【 初始化时选定 】, 此框首先显示列表 /菜
单中的内容，然后可在此框内设置它们的初
始选择，方法是单击欲作为初始选择的项，
若类型为列表，则可初始选择多个项，若类
型为菜单，则只能初始选择一个项。
? 按钮,是“动态列表 /菜单”对话
框，允许用户用数据库或其他内容源的内容
填充列表 /菜单表单对象。
2009-11-10 34
当类型选择了列表,就有以下的参数可以设置
? 【 高度 】, 列表框中文档中的高度，,1”表
示在列表中显示一个选项。 （即是一行的
意思）
? 【 选定范围 】, 是否表允许多项选择，勾
选表示允许，否则为不允许。
? 【 初始化选定 】, 可以在设置的菜单中设
置一个文档默认显示的选项,即初始值。
2009-11-10 35
四）、按钮
网页设计者设计表单后，还要提供一个使表
单发送、复位等命令，以便访问者输入信息后，
能用该命令发送信息或修改信息。通常是使用
按钮触发命令。在网页的表单设计中，按钮有
三种基本动作：
1）、提交表单（ Submit Form）,将表单域内
的内容发送到用户指定的地址。
2）、复位表单（ Reset Form）,将表单域内的
所有表单对象（组件）的内容还原为初始值。
3）、无动作（ None）,也有称为自定义，也值
无动作。
2009-11-10 36
在表单内插入按钮的方法：
1）、将光标置于表单内欲插入按钮的位置。
2）、单击表单面板的 按钮，插入一个按
钮，如下图：
插入的
按钮
2009-11-10 37
3）、选择按钮，打开按钮属性面板如下图，
设置按钮属性参数：
? 【 按钮名称 】, 定义按钮名称。一般取名为
,Submit”。
? 【 标签（卷标） 】, 定义按钮上的文字，可
以使用中文，如“确定”、“提交”、“注
册”等。
? 【 动作 】, 设置按钮触发的动作。（有以上
三种动作选择）
2009-11-10 38
五）、跳转菜单
跳转菜单是文档中的一种下拉菜单，在下
拉菜单中列出各种能够链接到其它文档
的选项。
创建跳转菜单的操作步骤：
1）、将光标定位到插入跳转菜单的位置。
2）、选择“插入栏”中的“表单”面板中
的跳转菜单（ Jump Menu）命令按钮,
打开插入跳转菜单对话框，如下图所示：
2009-11-10 39
插入跳转菜单对话框
2009-11-10 40
3）、单击 按钮，添加一个菜单项目。
4）、选择菜单项目，使用 这两个按钮调整该
菜单项目在列表中的位置。
5）、在“文字”框中输入菜单项目的内容。
6）、在“选择时，前往的 URL”的文本框中设置该菜
单项目链接的文件。
7）、在“打开 URL”下拉列表中选择打开文档的位置。
8）、选择“选项中的第一个复选框”，将添加一个
“前往”按钮。
9）、选择第二个复选框，在改变 URL时选择菜单的
第一个选项。
10）、设置完毕单击,OK”确定。
返回
2009-11-10 41
运用上面介绍的知识，下面举例说明如何
创建表单，并且向表单添加表单对象（表
单元素）。
例题：使用表单制作一个收集访问者信息
的网页。 要求有姓名（文本框）、性别
（单选按钮）、爱好（复选框）、学历
（下拉菜单）、留言（多行文本框）、提
交、复位按钮。
三、举例说明
2009-11-10 42
本节小结
本节主要介绍了表单作用、表单的各个对象的基本
功能及创建方法，最后又通过制作一个收集访问者
信息的表单网页的实例讲解，使大家对表单的功能
加深了理解。
重点熟练掌握网页表单的创建，灵活、合理使用
表单对象以满足实际的需要。
提示,可以使用表格来设置表单的格式。不能将表
单插入另一个表单中，但是可以在一个页面中包含
多个表单。
? 在设计表单时，请记住使用描述性文本标识表单域
（表单对象），以使用户知道自己正在对什么内容
作出响应，例如，“请键入您的姓名”是要求输入
姓名信息。
2009-11-10 43
作业
1、使用表单制作一个收集访问者信息
的网页。 要求有姓名（文本框）、性
别（单选按钮）、爱好（复选框）、
学历（下拉菜单）、留言（多行文本
框）、提交、复位按钮。
2、完成书中的调查表制作。
