当前位置：文档之家 › Dreamweaver+FlashCS6第7章 使用表单和行为

Dreamweaver+FlashCS6第7章 使用表单和行为

  • 格式：pptx
  • 大小：6.54 MB
  • 文档页数：56

下载文档原格式

  / 56

合集下载

Dreamweaver—使用行为六

Dreamweaver—使用行为六

一、使用行为1.行为：行为是用来动态响应用户操作、改变当前页面效果或执行特定任务。

行为是事件和由该事件触发的动作的组合。

2.应用行为用户可以将行为添加到整个文档（即添加到body标签），还可以添加到链接、图像、表单元素或其他HTML元素中的任何一种。

步骤：(1)在“设计”视窗中选择一个页面元素，例如图像链接。

(2)执行“窗口 行为”菜单命令或按“Shift+F4”快捷键，打开“行为”面板。

(3)单击加号按钮“＋”显示可用的选项，并从弹出的下拉式菜单中选择一个动作。

(4)在该动作对话框中，输入所需参数设置，然后单击“确定”按钮。

(5)触发动作的默认事件显示在事件栏中。

可从“事件”下拉列表框中选择另一个事件。

3.修改行为在添加了行为之后，可以修改触发动作的事件，添加删除动作以及修改动作的参数。

(1)在“设计”视图中选择一个添加有行为的对象(2)执行“窗口-->行为”菜单命令，打开“行为”面板。

(3)有以下几种修改方法：·修改动作的参数：双击该行为名称或将其选中并在键盘上按下“回车”键，然后修改对话框中的参数并单击“确定”按钮，即可完成。

·修改动作的顺序：选择某个动作然后单击上下箭头按钮，或者选择该动作然后剪切它，交将它粘贴到其他动作中所需的位置。

·删除某个行为：将其选中然后单击减号按钮“-”，或直接在键盘上按下“Del”键即可。

4.设置行为在行为面板中有种行为设置项，每一种行为都会有自己的设置方式和适用效果。

(1)弹出消息在浏览器中进行预览时，点击页面中的“翻页”链接马上就会设置好的提示框，如下图所示：(2)打开浏览器窗口(3)播放声音(4)检查表单(5)检查插件(6)检查浏览器(7)预先载入图像(8)交换图像(9)转到URL三、行为的应用1、弹出消息2、交换图像3、打开浏览器窗口。

Dreamweaver CS6网页设计立体化教程 第2版 第7章 模板、库、表单和行为的应用

Dreamweaver CS6网页设计立体化教程 第2版 第7章 模板、库、表单和行为的应用

7.3.1 表单的基础操作
27
3. 设置表单属性
要想利用表单网页收集用户信息，即通过单击“提交”按钮将表单内容汇总到服务器上， 就需要设置表单属性。可选择插入的表单或将插入点定位到表单区域中，再在“属性”面板中 进行设置即可。
7.3.1 表单的基础操作
28
4．使用Spry表单验证构件
Spry表单验证构件是Dreamweaver CS6中的一项基于AJAX的框架的表单功能，可以验证 用户输入的表单内容，并给出详细的提示信息。在需要插入Spry的位置定位插入点，执行【插 入】/【Spry】菜单命令，在打开的子菜单中执行相关的命令，插入Spry表单验证。
内容导航
7.1 课堂案例：制作“客户交流”网页
7.2 课堂案例：制作“产品介绍”网页 7.2.1 认识“资源”面板 7.2.2 创建库文件 7.2.3 应用库文件 7.2.4 编辑库文件 7.2.5 更新库文件 7.2.6 分离库文件
7.3 课堂案例：制作“会员注册”网页
7.4 课堂案例：制作“品牌展厅”网页
7.3.2 在表单中添加各种表单元素
32
4. 添加隐藏域
定位插入点到需插入隐藏域的位置，在“插入”面板中选择“隐藏域”选项，将直接在网 页表单区域插入一个隐藏域；选择该隐藏域，在“属性”面板中设置ID名称并赋予相应的值， 完成添加隐藏域的操作。
7.3.2 在表单中添加各种表单元素
33
5. 添加复选框
【插入】/【模板对象】/【可编辑区域】菜单命令，打开“新建可编辑区域”对话框，在“名
称”文本框中输入“嵌套表格”，单击
按钮。此时插入点所在的单元格将出现创建的
可编辑区域。
7.1.2 编辑模板
6

第7章 网页交互行为

第7章 网页交互行为
图7.9预览“弹出信息”
13
第7章 网页交互行为
7.2 使用Dreamweaver内置行为 7.2.3 打开浏览器窗口 【例7.3】在新窗口中打开图片。 （1）在文档窗口中插入一个对象，例如图片“pic4.jpg”。 （2）在“行为”面板中单击添加行为按钮，从弹出式菜单中选择“打开 浏览器窗口”菜单项，弹出“打开浏览器窗口”对话框。
4
第7章 网页交互行为
表7.1
动作类型 交换图像 弹出消息 恢复交换图像 打开浏览器窗口 拖动AP元素 改变属性 显示-隐藏元素 检查插件 检查表单 设置文本 调用JavaScript 跳转菜单 跳转菜单开始 转到URL 预先载入图像 说明 发生设置的事件后，用其他图片来取代选定图片 在设置的事件发生之后，显示警告信息 在运用交换图像动作之后，显示原来的图片 在新窗口中打开URL 在页面中按照指定的方式拖动某层元素移动 改变选定客体的属性 显示或隐藏特定元素 确认是否设有运行网页的插件 检查表单文档在有效性的时候才能使用 用指定的内容来代替页面上现有的容器 调用JavaScript 可以建立若干个链接的跳转菜单 在跳转菜单中选定要移动的站点之后，只有单击 GO 按钮才可以移 动到链接的站点上 可以转到特定的站点或者网页文档上 为了在浏览器中快速显示图片，事先下载图片之后1 行为的基本概念和操作 7.1.3 常见事件 事件用于指明执行某项动作的条件， 例如光标移动到对象上方、离开对 象、单击对象、双击对象、定时等 都是事件。在列表中选择一个行为， 单击该项左侧的事件名称栏中下拉 菜单箭头，如图7.3示。菜单中列出 了可以使用的触发事件，用户可以 根据实际需要进行设置，下面根据 使用用途分类介绍Dreamweaver中 提供的事件种类，如表7.2所示。
2

Dreamweaver电子教案课件第7章

Dreamweaver电子教案课件第7章
如果要向某个元素应用效果，该元素当前必须处于选定状态，或 者它必须具有一个有效的ID。如果该元素未选中，且没有有效的 ID 值，则需要向 HTML 代码中添加一个 ID 值。
✓ 增大/收缩：使元素变大或变小。 ✓ 挤压：使元素从页面的左上角消失。 ✓ 显示/渐隐：使元素显示或渐隐。 ✓ 晃动：模拟从左向右晃动元素。 ✓ 滑动：向上或向下移动元素。 ✓ 遮帘：向上或向下滚动百叶窗来隐藏或显示元素。 ✓ 高亮颜色：更改元素的背景颜色。
事件。 ✓ onFocus：本事件与onBlur事件正好相反，当用户将光标定位在
指定的焦点时，触发该事件。
✓ onKeyDown：按下键盘上的一个键，无论是否释放都会触发。 ✓ onKeyPress：按下键盘上的一个键，然后释放该键时触发。 ✓ onKeyUp：按下键盘上的一个键，在释放该键时，触发该事件。 ✓ onLoad：当一幅图像或页面完成载入之后，触发该事件。 ✓ onMouseDown：按下鼠标左键尚未释放时，触发该事件。 ✓ onMouseOver：将鼠标指针移开指定元素的范围时，触发该事件。 ✓ onMouseUp：当按下的鼠标按钮被释放时，触发该事件。 ✓ onMove：当浏览窗口或框架移动时，触发该事件。 ✓ onReadyStateChange：当指定的状态发生改变时，触发该事件。
2、行为面板
执行“窗口”｜“行为”命令。
✓ 仅显示附加到当前文档的那些事件 ✓ 按字母降序列出可应用于当前元素的所有事件 ✓ 添加行为 ✓ 删除当前选择的行为 ✓ 改变动作执行的顺序 ✓ 事件列表
3、认识事件
✓ onAbort：当用户终止浏览器对一幅图像的载入时会触发该事件。 ✓ onBlur：当指定的元素不再是用户交互行为的焦点时触发该事件。 ✓ onChange：当用户改变了页面中的值时，触发该事件。 ✓ onClick：当用户单击在页面上某一特定的元素时，触发该事件。 ✓ onDblClick：当用户双击在页面上某一特定的元素，触发该事件。 ✓ onError：当浏览器在载入页面或图像过程中发生错误时，触发该

第7章使用AP Div布局网页 中文版Dreamweaver CS6网页制作课件

第7章使用AP Div布局网页 中文版Dreamweaver CS6网页制作课件
3．用菜单命令更改堆叠顺序
选择需更改堆叠顺序的AP Div后，选择【修 改】/【排列顺序】命令，在弹出的子菜单中 选择“移到最上层”或“移到最下层”命令 即可。
从入门到精通
清华大学出版社
15
中文版Dreamweaver CS6网页制作从入门到精通
7.2.7 改变AP Div的可见性
1
隐藏AP Div
从入门到精通
清华大学出版社
18
Dreamweaver CS6 从入门到精通
7.3 AP DIV的属性设置
7.3.1 单个AP Div的属性设置 7.3.2 多个AP Div的属性设置
中文版Dreamweaver CS6网页制作从入门到精通
7.3.1 单个AP Div的属性设置
选择要设置属性的单个AP Div，在“属性” 面板中进行设置即可。
清华大学出版社
17
中文版Dreamweaver CS6网页制作从入门到精通
2．显示AP Div
如果要显示隐藏的AP Div，则需要在“AP 元 素”面板中选择隐藏的AP Div，再在选中AP Div上单击鼠标右键，在弹出的快捷菜单中选 择“可视”命令即可，再在编辑窗口的空白 区域单击鼠标左键即可显示AP Div。
从入门到精通
清华大学出版社
20
中文版Dreamweaver CS6网页制作从入门到精通
从入门到精通
清华大学出版社
12
中文版Dreamweaver CS6网页制作从入门到精通
1．在“属性”面板中更改AP Div的堆叠顺序
选择需改变堆叠顺序的AP Div后，在“属性” 面板中的“Z轴”文本框中输入所需的数值， 大于原数字可将该AP Div在堆叠顺序中上移， 小于原数字可将该AP Div在堆叠顺序中下移， 完成输入后按“Enter”键确认即可。

DW CS6 07

DW CS6 07

7.1.11 层靠齐到网格
在移动网页元素时可以让其自动靠齐到网格，还可以通过指定 网格设置来更改网格或控制靠齐行为。无论网格是否可见，都可以 使用靠齐。 应用Dreamweaver CS6中的靠齐功能，层与网格之间的关系如 铁块与磁铁之间的关系。层与网格线之间靠齐的距离是可以设定的。 层靠齐到网格 更改网格设置
7.2 应用层设计表格
课堂案例——精品家居网 将AP Div转换为表格 将表格转换为AP Div
7.2.1 课堂案例——精品家居网
使用将表格转换为AP Div命令将表格转换为层。
效果图
7.2.2 将AP Div转换为表格
将AP Div转换为表格 如果使用层创建布局的网页要在较早的浏览器中进行查看，那 么需要将AP Div转换为表格。若将AP Div转换为表格，则选择“修 改 > 转换 > 将AP Div转换为表格”命令，弹出“将AP Div转换为 表格”对话框，根据需要完成设置后，单击“确定”按钮。 防止层重叠 因为表单元格不能重叠，所以Dreamweaver CS5无法从重叠层创 建表格。如果要将一个文档中的层转换为表格以兼容IE 3.0浏览器， 则选择“防止重叠”选项来约束层的移动和定位，使层不会重叠。
课堂练习——我的音乐世界
使用层和属性面板制作阴影文字效果。
效果图
课堂练习——时尚礼品屋
使用绘制作AP Div按钮绘制层。使用行为命令制作显示隐藏层 效果。
效果图
课后习题——茶艺人生网页
使用绘制作AP Div按钮绘制层，使用图像按钮插入图
创建层 若想利用层来定位网页元素，先要创建层，再根据需要在层内插 入其他表单元素。有时为了布局，还可以显示或隐藏层边框。 显示或隐藏层边框 若要显示或隐藏层边框，可选择“查看 > 可视化助理 > 隐藏所 有”命令。

中文版 Dreamweaver CS6网页设计教程 第7章


22
7.3.10 “恢复交换图像”行为
“交换图像”和“恢复交换图像”经常是成对 出现的，这样就省去了使用人工恢复交换图像 的工作。 单击“行为”面板上的按钮，并从其下拉列表 中选择“恢复交换图像”选项，打开如图7-20 所示的对话框。单击对话框中的“确定”按钮， 即可恢复交换图像。
23
7.3.11 “显示-隐藏元素”行为
使用“打开浏览器窗口”行为的具体操作步骤 如下。
(1) 选择对象并打开“行为”面板。 (2) 单击按钮并在其下拉列表中选择“打开浏览器 窗口”选项，打开如图7-12所示的对话框。 (3) 单击“浏览”按钮选取要打开的文件，或者在 “要显示的URL”文本框中输入需要显示的URL。

7.3.2 “打开浏览器窗口”行为
单击对话框顶部的按钮向“预先载入图像”列表中添加图像。 单击“浏览”按钮，选取要预先加载的图像文件，或者在“图像 源文件”文本框中输入图像的路径和名称。
(4) (5)
设置完成后，单击“确定”按钮。 在“行为”面板中选择适当的事件。
21
7.3.9 “交换图像”行为
“交换图像”行为通过改变img标签的src属性来将一 幅图像替换为另外一幅，使用该行为可以创建交换图 像和其他图像效果。 使用“交换图像”行为的具体操作步骤如下。
4
7.1.2 事件
事件是由浏览器生成的消息，指示该页的浏览 者执行了某种操作。例如，当浏览者将鼠标指 针移动到某一个链接时，浏览器为该链接生成 一个onMouseOver 事件(鼠标滑过)，然后浏览 器查看是否存在当为该链接生成该事件时浏览 器应该调用的 JavaScript 代码(这些代码是在被 查看的页面中指定的)。不同的网页元素定义了 不同的事件，例如，在大多数浏览器中， onMouseOver(鼠标滑过)和onClick(鼠标单击) 是与链接关联的事件，而 onLoad(页面载入)是 与图像和文档的主体部分关联的事件。

Dreamweaver_CS6完美网页制作基础、实例与技巧从入门到精通课件第7章 使用模板和库和插件


7.4.1

创建库项目
库是一种特殊的Dreamweaver文件，其中包含 已创建以便放在网页上的单独的资源或资源复制 的集合。
7.4.2

应用库项目
当向页面添加库项目时， 将把实际内容以及对该 库项目的引用一起插入 到文档中。
7.5

安装和应用第三方插件
利用Dreamweaver附加功能的第三方插件，可以 把网页制作得更加美观，而且还可以制作动态的 页面。
教学内容：借助Dreamweaver CS6的模板功能 可以批量地制作几十种甚至几百种风格基本相 似的页面，极大地提高工作效率。
• • • •
教学重点 掌握模板的使用 掌握可编辑区的创建 掌握与应用库项目 掌握安装和应用第三方插件

模板实际上就是具有固定格式和内容的文件，文件 扩展名为.dwt。模板的功能很强大，通过定义和锁 定可编辑区域可以保护模板的格式和内容不会被修 改，只有在可编辑区域中才能输入新的内容。

在Dreamweaver中，模板是一种特殊的文档，可 以按照模板创建新的网页，从而得到与模板相似但 又有所不同的新的网页。
7.1.2

从现有文档创建模板
从现有文档创建模板的具体操作步骤如下。
7.2

创建可编辑区域
在模板中，可编辑区域是页面的一部分，对于基 于模板的页面，能够改变可编辑区域中的内容。
7.3

使用模板创建新网页
模板最强大的用途之一在于一次更新多个页面。从 模板创建的文档与该模板保持连接状态，可以修改 模板并立即更新基于该模板的所有文档中的设计。
7.4

创建与应用库项目
库用于存放页面元素，如图像、文本或其他对象 等。这些元素通常被广泛应用于整个站点，并且 能够重复使用，被称为库项目。

第8章 使用行为和表单——(网页设计与制作共11章)


跳转菜单：制作一次可建立若干个链接的跳转菜单。 跳转菜单开始：在跳转菜单中选定要移动的站点后，只有单 击“开始”按钮才可移动到链接的站点上。 转到URL：选定事件发生后，可以跳转到指定站点或网页文 档上。 预先载入图像：在下载图像之前预先载入一幅图像。

8.1.3 行为的基本操作
对行为的基本操作包括：添加行为、删除行为和编辑行为等。 1．添加行为 在编辑行为之前，先要为页面中的对象添加行为。可以将行 为添加到整个文档、链接、图像、表单对象或者任何其他的 HTML元素中。单击“行为”面板中的“添加行为”按钮， 在弹出的行为列表中选中一种行为，将打开对应的设置对话 框，然后进行详细的设置并确认。在“行为”面板中，单击 添加的行为事件设置列，可为该行为选择一个合适的事件类 型，如图3所示。 2．删除行为 选中文档窗口中的目标对象，“行为”面板中将罗列出该对 象上被定义的所有行为，选中需要删除的行为，单击“删除 事件”按钮，即可将其删除。
“设置框架文本”行为可用来动态设置框架的文本，用指定 的内容替换框架的内容和格式，该内容可以包含任何有效的 HTML代码。使用此行为可在框架中动态显示信息。 下面重点介绍设置状态栏文本和设置容器的文本。
〖学习目标〗为网页添加状态栏文本。 〖知识要点〗“状态栏文本”行为的使用。 〖案例效果〗浏览网页时，在网页的状态栏中显示设置的文 本信息，如图8-14所示。
第8章 使用行为和表单
8.1 学习任务：认识行为 8.2 案例1添加弹出提示信息的行为 8.3 案例2 制作网页加载时弹出公告页 8.4 案例3 使用行为设置图像特效——交换图像 8.5 案例4 通过行为设置文本 8.6 学习任务：表单和表单对象 8.7 案例5 制作“用户注册”页面 8.8 案例6 插入Spry表单元素 8.9 实训

DreamWeaver第七章 行为


超链接文本或图片制作弹出窗口：选中 该对象——onClick 属性选项组：导航工具栏、地址工具栏、 状态栏、菜单栏、需要时使用滚动条、 调整大小手柄 窗口名称（若多个，则必须有）
其他
设置框架文本 制作动态图片说明
设置层本
设置状态栏信息 设置播放声音
空链接 Mid文件 onLoad(背景音乐) Onclick e.g.在线音乐点播（播放声音，打开浏览器窗口）
面板
行为面板
显 示 设 置 事 件 显示所有事件 添加行为 删除事件 向上移动事件 向下移动事件
显示事件
显示动作
使用行为的总体方法
“窗口/行为”，打开行为面板 在文档窗口选中一个对象 单击“+”按钮，选择“显示事件”可选择不同 的浏览器版本 单击“+”按钮，选择合适的行为 设置行为的所有参数
交换图像
“恢复交换图像”
检查浏览器
准备同一内容的不同页面
适用于IE浏览器 适用于NetScape浏览器 适用于其他浏览器
触发事件：onLoad 判断每一种浏览器都会有3种选项
留在此页、打开指定网页、打开另一个指定 网页
制作弹出窗口
载入网页时弹出的窗口：在空白处单击
onLoad
设置框架文本、设置层文本、设置状态栏文本、设置 文本
显示/隐藏层 交换图像 检查表单
拖动层
e.g.拼图游戏（onMouseOver）
移动、放下目标、靠齐距离
高级
拖曳控制点、拖曳时、然后、呼叫javascript
调用javascript
e.g.alert(“您好！欢迎访问我的主页！”) Onload事件
第七章 行为
了解行为 dreamweaver内置行为 为对象附加行为 改变对象属性 拖动层 调用javascript 检查浏览器 制作探出窗口 其他行为
  1. 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
  2. 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
  3. 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
设置昵称文本字段
设置编号文本字段
7.1.3 插入表单对象
2. 插入密码字段
密码字段用于输入具有保密性质的内容，当用户在输入密码时，网页中将以“●”符号代替， 使内容不可见，以保证数据内容的隐私。其具体操作如下。
插入文本字段
设置ID和标签
7.1.3 插入表单对象
设置密码字段
插入文本字段
7.1.3 插入表单对象
01
大部分都是采用表单元素进行制作
登录网页 02
输入用户名和密码，单击按钮后进
行登录操作,这些操作都会使用到表
单中的文本、密码及按钮元素
留言板或电子邮件网页 03
在网页的公告栏或留言板上发表文 章或建议时，输入用户名和密码， 并填写实际内容的部分，全都是表 单要素
7.1.1 认识表单
2. 表单的组成元素 制作表单页面之前首先要创建表单，然后才能在表单区域内添加表单对象。在
设置复选框组
查看效果
7.1.3 插入表单对象
7. 插入多行文本字段 多行文本字段常用于浏览者留言和个人介绍等需输入较多内容的情况。
设置ID 和标签
设置多行文本字段属性
7.1.3 插入表单对象
8. 插入文件域 文件域表单元素可实现文件上传的功能，如上传用户头像。
插入文件域
设置ID和标签
7.1.3 插入表单对象
7.2.1 行为的基础知识
事件
onKeyPress onKeyUp onFocus onBlur
onAfterUpdate
onBeforeUpdate onError onFinish onHelp onMove
完善网页行为效果
7.2.1 行为的基础知识
行为是由事件和该事件所触发的动作组合而成的。动作控制何时执行（如单击时开始执行 等），事件控制执行的内容（如弹出对话框显示提示信息等）。
1. 事件 一般情况下，每个浏览器都提供一组事件，不同的浏览器有不同的事件，但常用的事件大
部分的浏览器都支持。
7.2.1 行为的基础知识
插入列表
设置标签属性
7.1.3 插入表单对象
设置列表属性
设置列表值
预览效果
查看效果
7.1.3 插入表单对象
5. 插入复选框 如果想让浏览者在给定的选项中选择一个或多个选项，可在表单中添加复选框。
插入复选框
设置复选框属性
7.1.3 插入表单对象
6. 插入复选框组 复选框组的效果与添加多个复选框的效果相同，但其操作比重复添加复选框更加便捷。
插入的文件域
设置字符宽度和数量
7.1.3 插入表单对象
9. 插入按钮 按钮可用于提交表单或重置操作，它只有在被单击时才能执行，对于表单网页而言，按钮
元素必不可少。
设置ID名称
设置插入的按钮属性
Байду номын сангаас
7.1.3 插入表单对象
10. 插入字段集 字段集可将多个表单元素整合到一起，使页面看上去更加整齐。
选择表单元素插入字段集
普通高等学校计算机教育“十二五”规划教材
第7章 使用表单和行为
网页设计与制作立体化教程（Photoshop+Dreamweaver+Flash CS6双色微课版）
内容导航
7.1 课堂案例：制作“学员注册”网页 7.2 课堂案例：完善网页行为效果 7.3 项目实训 7.4 课后练习
2
课堂案例：制作“学员注册”网页
Dreamweaver中组成表单的元素很有多，如文本字段、复选框、单选项、按钮、选择等。
3. HTML中的表单 在HTML中，表单是使用<form></form>标记表示，并且表单中的各种元素都必须存在于该
标记之间。
7.1.2 创建表单
表单是表单对象的容器，任何表单对象都必须在表单中才能生效，如果用户在添加表单对 象时并未创建表单，这时系统将自动在文档中添加表单。表单的创建比较简单，但创建后的表 单在默认情况下是以“100%”宽度显示，所以在创建表单前可根据实际需要创建一个容器，然 后再进行表单的插入。
老洪告诉米拉，在网页中，表单是一 个常用的元素，它以各种各样的形式存 在于各种网页中，如登记注册邮件、填 写资料或收集用户的资料等，因此需要 掌握表单的相关操作。本例将为小儿郎 网页制作学员注册页面，完成后的参考 效果如图所示。
“学员注册”网页效果
7.1.1 认识表单
1. 表单的形式
注册网页
会员制网页中，要求输入的会员信息的形式，
设置ID和标签
插入文本字段
7.1.3 插入表单对象
3. 插入单选按钮组
单选按钮组适用于多项中选择一项的情况，如性别、职位等信息就可以利用单选按钮组来 设置。
（1）插入单选按钮组
（2）更改标签名称
（3）调整单选按钮组
7.1.3 插入表单对象
4. 插入列表或菜单 列表和菜单可为浏览者提供预定选项，方便用户进行选择。
常用的事件及作用说明如下。
事件
onLoad onUnload onMousOver onMouseDown onMouseUp onMouseOut onMouseMove onMouseWheel onClick onDblClick onKeyDown
作用说明
当载入网页时触发 当用户离开页面时触发 当鼠标光标移入指定元素范围时触发 当用户按下鼠标左键但没有释放时触发 当用户释放鼠标左键后触发 当鼠标光标移出指定元素范围时触发 当用户在页面上拖动鼠标时触发 当用户使用鼠标滚轮时触发 当用户单击了指定的页面元素，如链接、按钮或图像映像时触发 当用户双击了指定的页面元素时触发 当用户任意按下一键时，在没有释放之前触发
设置字段集标签名称
7.1.3 插入表单对象
插入的字段集
预览网页效果
内容导航
7.1 课堂案例：制作“学员注册”网页 7.2 课堂案例：完善网页行为效果 7.3 项目实训 7.4 课后练习
24
课堂案例：制作“学员注册”网页
通过观察，米拉发现许多网页会在打 开时会弹出欢迎提示框，这极大地提高 网页与用户之间的交互性，老洪告诉米 拉，这是因为在网页中添加了行为，因 此。米拉决定为制作的“学员注册”网 页和“详情网”网页添加相关的行为。
7.1.2 创建表单
下面在“xelzc.html”网页中创建一个表单，并设置相关的属性。
插入表单
插入的表单区域
7.1.3 插入表单对象
1. 插入单行文本字段
单行文本字段适合少量文本的输入，如输入账户名称、邮箱地址和文章标题等。其具体操 作如下。
插入文本字段
设置ID和标签
7.1.3 插入表单对象