第十讲行为事件 我们学习图层的相关内容的时候曾经接触 了为一个对象(如图片、链接等)添加 个“行为”(或称为动作,例如显示隐藏 图层、拖动图层等),然后产生一个 on Mouse Overt(鼠标经过)事件的例子。 作为一个对于网页设计了解不多,又不了解 复杂编程的人来说, Dreamweaver提供的 行为工具将是最好的选择。通过这一章节 的学习,要求同学们掌握如何使用系统提 供的行为技术来制作一些复杂的网页
主要内容 使用行为面板 、应用行为 介绍 Dreamweaver提供的行为 四、本节小结 五、作业
使用行为面板 介绍几个基本概念 1、行为的概念 行为就是一段 JavaScript代码,这些代码 放置在文档中执行特定的任务(例如打开 浏览器窗口、显示或隐藏层、播放声音或 影片),以实现网页的各种特殊的功能。 2、行为的基本元素 在具体操作中:一个行为是一个事件和由 该事件触发的动作组成的。因此它的基本 元素有两个:一个是事件,一个是动作
3、在网页中怎样使用行为? 在网页中是通过“行为”面板把“行为” 附加(添加)到网页元素中来实现各种不 同的网页效果。 4、什么是事件? 事件是浏览器产生的有效信息,也就是说访 问者对网页所做的事情。如: on Click onMouseOver、 on MouseOu等(事件与 浏览器的版本有关,每个浏览器都提供 组事件,这些事件可以与“行为”面板的 动作(+)弹出式菜单中列出的动作相关联 。浏览器的版本越高,可以使用的事件就 越多,反之越少。)
标准的事件 下面介绍一些常用的事件。首先,不同版本 或不同浏览器对事件的支持是不一样。可 以通过设置“显示事件”命令来选择对应 的浏览墨 3.0和更高版本浏览器 onUnload 4.0和更高版本浏览器 onBe foreUnload IE3.0 onDat aAvailable V IE 4.0 onDatasetChanged IE5.0 onDatasetComplete IE5.5 onDragstart IE6.0 onErrorUpdate Netscape 3.0 onFilterChange Netscape 4.0 Netscape 6.0 显示事件
在使用行为事件时,一定要考虑访问者的浏 览器的版本和类型,因为低版本的浏览器 支持的动作不多。在事件的菜单中可以看 到所有的事件,但不是所有的事件都常用 下面介绍常用的事件及意义和支持该事件 的浏览器。 1)鼠标类 on Mouse Down(N4,E4,E5):当鼠标键按下时 就会发生动作。 on MouseMove(N3,E4,E5):当鼠标在对象上 面移动时就会发生动作
onMouseOver(N3,N4E3,E45)当鼠标移 动到对象的范围时发生动作。 on Mouse Out(N3,N4,4,5):当鼠标从对象 上移开时发生动作。 onMouseUp(N4,E4,E5):当鼠标左键按下又 释放时发生动作。 onclick(N3,N4,|E3E4,E5)当鼠标单击对 象时发生动作,例如链接、按钮、图片等 对象用得较多。 on DblClick(N4,L4,E5):当鼠标单双对象时发 生动作
2)键盘类 onKey Down(N4,E4E5):当键盘上的任何 个键被按下时就会发生动作 onKey Press(N4E4E5):当键盘上的一个键 被按下又释放时发生动作 onKeyUp(N4,E45)当键盘上的一个键被 按下一段时间并被释放时发生动作。 3)其它类型事件 onLoad(N3,N4,E3,E4,5):当打开网页时动 作发生。 onUnload(N3,N4,E3,E4,E5):当离开网页时 动作发生
on Scro(E4,E5):当滚动条被移动时动作发生 on Resize(N4E4E5):当浏览器窗口大小被改 变时动作发生。 on Change(N3,N4,E3,E4,E5)当浏览者改 变了下拉框或文本框中的一个值时动作发生。 on Focus(N3,N4,3,E4,5):当元素获得焦 点时,比如单击了一个文本框时动作发生 on Blur(N3,N4,3E4E5):和 on Focus相反, 当元素失去焦点时动作发生
5、什么是动作? 动作指的是“行为”中的 JavaScript代码所 执行特定的操作,如打开浏览器窗口、显 示或隐藏层、播放声音等。 综上所述,可以得归纳如下几点:“行为” 是响应某一“事件”而采取的一个“动作 ”;“行为”是通过“行为”面板来添加 到网页元素中;行为中的动作必须要有由 与它关联的事件来触发 注意:行为代码是客户端 JavaScript代码; 即它运行于浏览器中,而不是服务器上