《网页制作014》由会员分享，可在线阅读，更多相关《网页制作014（39页珍藏版）》请在金锄头文库上搜索。
1、下载下载第14章行为和时间线如果要执行较复杂的数据处理，通常需要执行服务器端的脚本或程序。然而如果仅仅希望自己同页面中的元素进行简单的交互控制，每次都连接到服务器就显得很不现实，这不仅使交互控制变得缓慢，而且还延长了联机时间，造成不必要的浪费。如果仅仅希望进行简单的页面中交互控制，则可以使用客户端的脚本或程序。所谓客户端，也即脚本程序被包容在当前的网页中，用户可以直接在网页中进行各种动作，实现信息交互，而不必连入I n t e r n e t服务器。事实上，我们在介绍表单的一章中，已经举过一个客户端脚本的例子。很多人通过在文档中包含J a v a S c r i p t脚本来实现用户同页面的交
2、互，然而编写脚本既复杂，又需要专门的学习，所以， D r e a m w e a v e r提供了一种称作“ B e h a v i o r” （行为）的机制，帮助您构建页面中的交互行为。可以将行为看作是 D r e a m w e a v e r的内置J a v a S c r i p t库，它不仅可以帮助您构建脚本，还可以对现有脚本进行管理。利用 D r e a m w e a v e r，您不用书写一行代码，就可以实现丰富的动态页面效果，实现人和网页的交互。本章主要介绍如何利用D r e a m w e a v e r构建行为，实现网页的动态效果。14.1 行为概述实际上，我们曾经接触过
3、行为，为文档添加导航条、跳转菜单、轮替图像等，实际上都是使用的行为。这一节，我们介绍行为的基本概念。14.1.1 行为的概念所谓行为（B e h a v i o r） ，顾名思义，就是在网页中进行的一系列动作，通过这些动作，可以实现用户同网页的交互，也可以通过动作使某个任务被执行。一般来说，一个行为应该由一个事件（ e v e n t）和一个动作（a c t i o n）所组成。例如，当用户将鼠标移动到一幅图像上，这就产生了一个事件，如果这时候图像变化（这就是我们前面介绍过的轮替图像） ，则实际上就导致了一个动作发生。动作通常由一段J a v a S c r i p t代码所组成，利用这段代码
4、可以完成相应的任务，例如打开浏览器、播放声音或视频等，在 D r e a m w e a v e r中，可以使用D r e a m w e a v e r内置的行为来往页面中添加J a v a S c r i p t代码，而不用自己书写，当然，也可以对现有的代码进行修改，使之更符合自己的需要。事件则通常由浏览器所定义，它可以被附加到各种页面元素上，也可以被附加到 H T M L标记中。通常一个事件总是针对页面元素或标记而言的。例如，在大多数浏览器中的超级链接上都会发生o n M o u s e O v e r、o n M o u s e O u t和o n C l i c k这三种事件。当鼠标
5、移动到链接上，就发生链接的o n M o u s e O v e r事件，而鼠标移动到链接之外，就发生链接的 o n M o u s e O u t事件，而单击链接，就发生链接的o n C l i c k事件。另一个常见的事件是 o n L o a d，它同图像或是文档正文相关联，当载入文档时，就发生文档的o n L o a d事件，而载入图像时，就发生图像的o n L o a d事件。将事件和动作组合起来，就构成了行为，例如，将 o n C l i c k行为同一段J a v a S c r i p t代码相关联，在单击鼠标时就可以执行相应的 J a v a S c r i p t代码。通常
6、，我们将事件产生的这个过程称作触发。不是所有的动作都需要用户的干涉才会发生，例如我们可以指定某个动作每隔1 0秒运行一次，当然，这实际上还是由事件触发的，只是这种事件不是通过用户本身的行为而产生的罢了。有时候会有多个动作同一个事件相关联，换句话说，当事件发生时，会导致多个动作被执行。在D r e a m w e a v e r中，可以指定这些动作发生的顺序，从而实现需要的结果。D r e a m w e a v e r内置了很多行为动作，这仿佛是一个现成的 J a v a S c r i p t库，即便您不熟悉J a v a S c r i p t代码，也可以构建同页面的交互。除 M a c
7、r o m e d i a公司之外，有些第三方厂商提供了更多的行为库，您可以从I n t e r n e t上下载它们，然后在D r e a m w e a v e r中应用，请参看1 4 . 2 . 4一节的介绍。实际上， D r e a m w e a v e r提供了丰富的编程接口（ A P I） ，您可以根据相应的规范，自行构建需要的行为库，并将之融合到 D r e a m w e a v e r中，相关信息，可以查看D r e a m w e a v e r的扩展帮助。14.1.2 认识事件我们已经了解了什么是行为，也知道事件在行为中的作用。这一节里，我们介绍一些基本的事件类型，以帮
8、助读者更好地了解行为，以便在创作网页时更加得心应手。下面将要介绍的就是在创作网页时常见的事件及其含义，需要注意的是，不同版本的浏览器所支持的事件类型可能也不相同。为了更好地说明问题，我们进行如下约定：事件名称后标有“I E 3”的，表明它适用于Internet Explorer 3.0浏览器；标有“I E 4”的，表明它适用于Internet Explorer 4.0浏览器；标有“N S 3”的，表明它适用于Netscape Navigator 3.0浏览器；标有“N S 4”的，表明它适用于Netscape Navigator 4.0浏览器。要了解更多的事件信息，可以从 D r e a m
9、w e a v e r安装目录的Configuration/ Behaviors/Events文件夹中找寻，在该文件夹下包含多个 H T M L文档，您可以根据浏览器的不同，打开相应文档，然后查询事件信息。下面开始介绍常见的事件类型和含义。O n A b o r t（I E 4、N S 3、N S 4）当用户停止浏览器对图像的载入时会触发该事件。例如，当图像被下载时用户单击了浏览器的“停止”按钮，这时就会触发该事件。o n A f t e r U p d a t e（I E 4）当页面上一个捆绑数据的元素完成对数据源的更新时会触发该事件。o n B e f o r e U p d a t e（
10、I E 4）当页面上一个捆绑数据的元素中的数据被改变，并即将失去焦点时会触发该事件。该事件发生在数据源被更新之前。o n B l u r（I E 3、I E 4、N S 3、N S 4）该事件同o n F o c u s事件正好相反。当指定的元素停止从用户的交互行为上获取焦点时就会触发该事件。例如，当用户在文本框中单击之后，再单击文本框之外，浏览器就会针对该文本框产生一个 o n B l u r事件。o n B o u n c e（I E 4）当选取框元素中的内容延伸到选取框元素边界之外时，就会触发该事件。o n C h a n g e（I E 3、I E 4、N S 3、N S 4）当用户改
11、变了页面中的值时就会触发该事件。例第14章 行为和时间线309下载如，当用户从下拉列表（下拉菜单）中选择了一个菜单项，或是当用户改变了文本框中的文本，并单击页面上的其他位置时，就会触发该事件。o n C l i c k（I E 3、I E 4、N S 3、N S 4）当用户单击特定的页面元素，例如链接、按钮或图像映像时，就会触发该事件。o n D b l C l i c k（I E 4、N S 4）当用户双击特定的页面元素时就会触发该事件。o n E r r o r（I E 4、N S 3、N S 4）当浏览器在载入页面或图像时发生错误，就会触发该事件。o n F i n i s h（I E
12、4）当选取框元素中的内容完成一个循环时就会触发该事件。o n F o c u s（I E 3、I E 4、N S 3、N S 4）当指定元素通过用户的交互行为获得焦点时就会触发该事件。例如在一个文本框上单击时，该文本框上就产生一个 o n F o c u s事件。o n H e l p（I E 4）当用户单击浏览器的帮助按钮（通常是 F 1）或从浏览器的“帮助”菜单中选择帮助菜单项时，就会触发该事件。o n K e y D o w n（I E 4、N S 4）当用户按下了一个键，在尚未释放之前，会触发该事件。o n K e y P r e s s（I E 4、N S 4）当用户按下键然后又释放
13、键，则就会触发该事件。该事件很像o n K e y D o w n和o n K e y U p事件的组合。o n K e y U p（I E 4、N S 4）当用户释放被按下的键时，就会触发该事件。o n L o a d（I E 3、I E 4、N S 3、N S 4）当图像或页面被完全载入之后，就会触发该事件。o n M o u s e D o w n（I E 4、N S 4）当用户按下鼠标左键，在尚未释放之前，会触发该事件。o n M o u s e M o v e（I E 3、I E 4）当用户将鼠标指针在一个页面元素上移动时，在该页面元素上就会触发该事件。o n M o u s e O
14、 u t（I E 4、N S 3、N S 4）当鼠标指针移出了指定元素（例如链接）的范围时，在该页面元素上就会触发该事件。o n M o u s e O v e r（I E 3、I E 4、N S 3、N S 4）当鼠标第一次移入指定元素（例如链接）的范围时，就会触发该事件。o n M o u s e U p（I E 4、N S 4）当按下的鼠标按钮被释放时，就会触发该事件。o n M o v e（N S 4）当浏览器窗口或框架移动时，就会触发该事件。例如，拖动浏览器窗口，在桌面上移动，就会触发该事件。o n R e a d y S t a t e C h a n g e（I E 4）当指定元
15、素的状态被改变时，就会触发该事件。这些可能的元素状态包括未初始化（u n i n i t i a l i z e d） 、载入（l o a d i n g）和完成（c o m p l e t e）等。o n R e s e t（I E 3、I E 4、N S 3、N S 4）当表单中的数据被复位为默认值时，就会触发该事件。o n R e s i z e（I E 4、N S 4）当用户重设浏览器窗口或框架的大小时，就会触发该事件。o n R o w E n t e r（I E 4）在当前捆绑数据源的记录指针被改变后，就会触发该事件。o n R o w E x i t（I E 4）在当前捆绑数据源
16、的记录指针将要改变时，就会触发该事件。o n S c r o l l（I E 4）当用户利用滚动条或箭头键上下滚动文档内容时，就会触发该事件。o n S e l e c t（I E 3、I E 4、N S 3、N S 4）当用户从一个文本框中选中文本时，就会触发该事件。o n S t a r t（I E 4）当选取框元素中的内容开始循环时，会触发该事件。o n S u b m i t（I E 3、I E 4、N S 3、N S 4）当用户递交一份表单时，就会触发该事件。310Dreamweaver 3网页设计下载o n U n l o a d（I E 3、I E 4、N S 3、N S 4）当用户离开页面时，就会触发该事件。例如，当用户从一个页面跳转到另一个页面时，原先页面上就会触发该事件。14.2 应用行为介绍了行为的基本概念后，我们就可以开始学习如何在文档中应用行为。14.2.1 认识行为面板在D r e a m w e a v e r中，对行为的添加和控制主要是通过行为面板实现的。您可以按照如下方法实现行为面板。方法一：打开“Wi n d o w”菜单，选择“
