论文部分内容阅读
摘要:该文介绍了Dreamweaver软件的行为功能,分析了该功能实现过程中可能出现的各种问题,最后通过用户与页面的交互实例提供了完整的脚本代码。
关键词:Dreamweaver;行为;事件
中图分类号:TP317文献标识码:A文章编号:1009-3044(2008)32-1210-02
Analysis and Implementation of Action Function of Dreamweaver
DING hui1,2
(1.Jiangsu University, Zhenjiang 212013, China; 2.Nanjing Forest Police College, Nanjing 210046, China)
Abstract: This paper introduces the action function of Dreamweaver. Analyzes the problems easy to occur during the implementation process and provides the complete script code of example of interaction between use and web page.
Key words: dreamweaver; action; events
当一个网页做好之后,有时需要它能够接受外界的信息,并且对这些信息做出相应的响應。这时就要为网页添加相应的动态或交互内容,使网页能对外界的信息进行反馈,然后自动执行它内部制定的动作。一般说来,动态网页是通过JaveScript或基于JaveScript的DHTML代码来实现的。包含JaveScript脚本的网页,还能够实现用户与页面的简单交互。但是编写脚本既复杂又专业需要专门学习,而Dreamweaver提供的“行为”的机制,虽然行为也是基于JaveScript来实现动态网页和交互的,但却不需书写任何代码。在可视化环境中按几个按钮,填几个选项就可以实现丰富的动态页面效果,实现人与页面的简单交互。
行为是事件与动作的彼此结合。例如,当鼠标移动到网页的图片上方时,图片高亮显示,此时的鼠标移动称为时间,图片的变化称为动作,一般的行为都是要有事件来激活动作。动作时由预先写好的能够执行某种任务的JavaScript代码组成,而事件是由浏览器前用户的操作相关,如单击鼠标、鼠标上滚等。
1 了解行为
行为是通过响应某一具体事件而采取的一个或多个动作,也就是说,行为是要由事件和动作来组成的。当把一个事件和一个动作组合成一个行为后,再把它赋给一个页面元素,当发生指定事件时,就会触发执行动作,运行相应的JavaScript程序。“行为”可以创建网页动态效果,实现用户与页面的交互。行为是由事件和动作组成的,例如:将鼠标移到一幅图像上产生了一个事件,如果图像发生变化(前面介绍过的轮替图像),就导致发生了一个动作。与行为相关的有三个重要的部分——对象、事件和动作。
1.1 对象(Object)
对象是产生行为的主体,很多网页元素都可以成为对象,如图片、文字、多媒体文件等,甚至是整个页面。
1.2 事件(Event)
事件是触发动态效果的原因,它可以被附加到各种页面元素上,也可以被附加到HTML标记中。一个事件总是针对页面元素或标记而言的,例如:将鼠标移到图片上、把鼠标放在图片之外、单击鼠标,是与鼠标有关的三个最常见的事件(onMouseOver、onMouseOut、onClick)。不同的浏览器支持的事件种类和多少是不一样的,通常高版本的浏览器支持更多的事件。
1.3 动作(Action)
行为通过动作来完成动态效果,如:图片翻转、打开浏览器、播放声音都是动作。动作通常是一段JaveScript代码,在Dreamweaver中使用Dreamweaver内置的行为往页面中添加JaveScript代码,就不必自己编写。
1.4 事件与动作
将事件和动作组合起来就构成了行为,例如,将onClick行为事件与一段JaveScript代码相关联,单击鼠标时就可以执行相应的JaveScript代码(动作)。一个事件可以同多个动作相关联(1:n),即发生事件时可以执行多个动作。为了实现需要的效果,我们还可以指定和修改动作发生的顺序。
2 使用行为
如果想要使网页更“聪明”的话,就要使用行为来感知外界的信息并做出相应的响应。这些外界信息包括鼠标的活动,如页面的调用与关闭、鼠标移动到页面元素上点击元素或移开元素,以及焦点的改变和键盘的情况等各种变化,对不同的页面内容有不同的事件,另外能够响应的事件也和浏览器有关,一般说来,3.0的浏览器能够响应的事件要少于4.0浏览器,而IE4能够响应的事件要多于Netscape4.0浏览器,我们可以根据不同的浏览器进行不同的设置。
2.1 改变对象属性
使用“改变属性”动作更改对象某个属性(例如层的背景颜色或表单的动作)的值。您可以更改的属性是由浏览器决定的。例如,您可以动态设置层的背景颜色。只有在您比较熟悉HTML和JavaScript 的情况下才使用此动作。若要使用“改变属性”动作,请执行以下操作:选择一个对象并打开“行为”面板,从“动作”弹出菜单中选择“更改属性”。从“对象类型”弹出菜单中选择您要更改其属性的对象的类型。 “命名对象”弹出菜单马上列出所有所选类型的命名对象。从“命名对象”弹出菜单中选择一个对象。从“属性”弹出菜单中选择一个属性,或在文本框中输入该属性的名称。例如:在网页中插入一个图片,并且设置图片的名字为image1,最终要求:浏览者用鼠标单击图片时,图片变为另一幅。
2.2 显示/隐藏层
“显示-隐藏层”动作显示、隐藏或恢复一个或多个层的默认可见性。此动作用于在用户与页进行交互时显示信息。“显示→隐藏层”还可用于创建预先载入层,即一个最初挡住页的内容的较大的层,在所有页组件都完成载入后该层即消失(可做一个广告效果,记得在新浪见过这样的广告)。“显示→隐藏层”动作,具体操作:
1) 选择“插入”→“布局对象”→“层”然后在“文档”窗口中绘制一个层。
2) 重复此步骤可以创建其它的层。
3) 在“文档”窗口中单击取消对层的选择,然后打开“行为”面板。
4) 单击加号( )按钮并从“动作”弹出菜单中选择“显示→隐藏层”。
在“命名的层”列表中选择要更改其可见性的层。单击“显示”以显示该层、单击“隐藏”以隐藏该层、或单击“默认”以恢复层的默认可见性。
2.3 弹出消息
“弹出消息”动作显示一个带有您指定的消息的 JavaScript 提示。因为 JavaScript 提示只有一个按钮(“确定”),所以使用此动作可以提供信息,而不能为用户提供选择。要注意的是:我们无法控制 JavaScript 提示的外观,它取决于访问者的浏览器。如果我们希望对消息的外观进行更多的控制,可考虑使用“打开浏览器窗口”行为。具体制作过程:插入一个按钮,选择按钮,打开“行为”面板,从动作中选择“弹出消息”。并且输入我们要在消息窗口中显示的内容。在“消息”文本框中输入我们要告诉浏览者的信息。别忘了看看行为面板中设置的动作是onclick,单击“确定”,保存文档。
关键词:Dreamweaver;行为;事件
中图分类号:TP317文献标识码:A文章编号:1009-3044(2008)32-1210-02
Analysis and Implementation of Action Function of Dreamweaver
DING hui1,2
(1.Jiangsu University, Zhenjiang 212013, China; 2.Nanjing Forest Police College, Nanjing 210046, China)
Abstract: This paper introduces the action function of Dreamweaver. Analyzes the problems easy to occur during the implementation process and provides the complete script code of example of interaction between use and web page.
Key words: dreamweaver; action; events
当一个网页做好之后,有时需要它能够接受外界的信息,并且对这些信息做出相应的响應。这时就要为网页添加相应的动态或交互内容,使网页能对外界的信息进行反馈,然后自动执行它内部制定的动作。一般说来,动态网页是通过JaveScript或基于JaveScript的DHTML代码来实现的。包含JaveScript脚本的网页,还能够实现用户与页面的简单交互。但是编写脚本既复杂又专业需要专门学习,而Dreamweaver提供的“行为”的机制,虽然行为也是基于JaveScript来实现动态网页和交互的,但却不需书写任何代码。在可视化环境中按几个按钮,填几个选项就可以实现丰富的动态页面效果,实现人与页面的简单交互。
行为是事件与动作的彼此结合。例如,当鼠标移动到网页的图片上方时,图片高亮显示,此时的鼠标移动称为时间,图片的变化称为动作,一般的行为都是要有事件来激活动作。动作时由预先写好的能够执行某种任务的JavaScript代码组成,而事件是由浏览器前用户的操作相关,如单击鼠标、鼠标上滚等。
1 了解行为
行为是通过响应某一具体事件而采取的一个或多个动作,也就是说,行为是要由事件和动作来组成的。当把一个事件和一个动作组合成一个行为后,再把它赋给一个页面元素,当发生指定事件时,就会触发执行动作,运行相应的JavaScript程序。“行为”可以创建网页动态效果,实现用户与页面的交互。行为是由事件和动作组成的,例如:将鼠标移到一幅图像上产生了一个事件,如果图像发生变化(前面介绍过的轮替图像),就导致发生了一个动作。与行为相关的有三个重要的部分——对象、事件和动作。
1.1 对象(Object)
对象是产生行为的主体,很多网页元素都可以成为对象,如图片、文字、多媒体文件等,甚至是整个页面。
1.2 事件(Event)
事件是触发动态效果的原因,它可以被附加到各种页面元素上,也可以被附加到HTML标记中。一个事件总是针对页面元素或标记而言的,例如:将鼠标移到图片上、把鼠标放在图片之外、单击鼠标,是与鼠标有关的三个最常见的事件(onMouseOver、onMouseOut、onClick)。不同的浏览器支持的事件种类和多少是不一样的,通常高版本的浏览器支持更多的事件。
1.3 动作(Action)
行为通过动作来完成动态效果,如:图片翻转、打开浏览器、播放声音都是动作。动作通常是一段JaveScript代码,在Dreamweaver中使用Dreamweaver内置的行为往页面中添加JaveScript代码,就不必自己编写。
1.4 事件与动作
将事件和动作组合起来就构成了行为,例如,将onClick行为事件与一段JaveScript代码相关联,单击鼠标时就可以执行相应的JaveScript代码(动作)。一个事件可以同多个动作相关联(1:n),即发生事件时可以执行多个动作。为了实现需要的效果,我们还可以指定和修改动作发生的顺序。
2 使用行为
如果想要使网页更“聪明”的话,就要使用行为来感知外界的信息并做出相应的响应。这些外界信息包括鼠标的活动,如页面的调用与关闭、鼠标移动到页面元素上点击元素或移开元素,以及焦点的改变和键盘的情况等各种变化,对不同的页面内容有不同的事件,另外能够响应的事件也和浏览器有关,一般说来,3.0的浏览器能够响应的事件要少于4.0浏览器,而IE4能够响应的事件要多于Netscape4.0浏览器,我们可以根据不同的浏览器进行不同的设置。
2.1 改变对象属性
使用“改变属性”动作更改对象某个属性(例如层的背景颜色或表单的动作)的值。您可以更改的属性是由浏览器决定的。例如,您可以动态设置层的背景颜色。只有在您比较熟悉HTML和JavaScript 的情况下才使用此动作。若要使用“改变属性”动作,请执行以下操作:选择一个对象并打开“行为”面板,从“动作”弹出菜单中选择“更改属性”。从“对象类型”弹出菜单中选择您要更改其属性的对象的类型。 “命名对象”弹出菜单马上列出所有所选类型的命名对象。从“命名对象”弹出菜单中选择一个对象。从“属性”弹出菜单中选择一个属性,或在文本框中输入该属性的名称。例如:在网页中插入一个图片,并且设置图片的名字为image1,最终要求:浏览者用鼠标单击图片时,图片变为另一幅。
2.2 显示/隐藏层
“显示-隐藏层”动作显示、隐藏或恢复一个或多个层的默认可见性。此动作用于在用户与页进行交互时显示信息。“显示→隐藏层”还可用于创建预先载入层,即一个最初挡住页的内容的较大的层,在所有页组件都完成载入后该层即消失(可做一个广告效果,记得在新浪见过这样的广告)。“显示→隐藏层”动作,具体操作:
1) 选择“插入”→“布局对象”→“层”然后在“文档”窗口中绘制一个层。
2) 重复此步骤可以创建其它的层。
3) 在“文档”窗口中单击取消对层的选择,然后打开“行为”面板。
4) 单击加号( )按钮并从“动作”弹出菜单中选择“显示→隐藏层”。
在“命名的层”列表中选择要更改其可见性的层。单击“显示”以显示该层、单击“隐藏”以隐藏该层、或单击“默认”以恢复层的默认可见性。
2.3 弹出消息
“弹出消息”动作显示一个带有您指定的消息的 JavaScript 提示。因为 JavaScript 提示只有一个按钮(“确定”),所以使用此动作可以提供信息,而不能为用户提供选择。要注意的是:我们无法控制 JavaScript 提示的外观,它取决于访问者的浏览器。如果我们希望对消息的外观进行更多的控制,可考虑使用“打开浏览器窗口”行为。具体制作过程:插入一个按钮,选择按钮,打开“行为”面板,从动作中选择“弹出消息”。并且输入我们要在消息窗口中显示的内容。在“消息”文本框中输入我们要告诉浏览者的信息。别忘了看看行为面板中设置的动作是onclick,单击“确定”,保存文档。