JavaScript语言与Ajax应用第05章事件处理

《JavaScript语言与Ajax应用第05章事件处理》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、JavaScript语言与Ajax应用（第二版）主编董宁陈丹中国水利水电出版社第5章事件处理目录第5章事件处理5.1浏览器中的事件5.2事件与DOM5.3用JavaScript处理事件5.4事件处理高级应用5.1浏览器中的事件第5章事件处理事件是指用户载入目标页面直到该页面被关闭期间浏览器的动作及该页面对用户操作的响应。事件的复杂程度大不相同，简单的如鼠标的移动、当前页面的关闭、键盘的输入等，复杂的如拖曳页面图片或单击浮动菜单等。事件处理器是与特定的文本和特定的事件相联系的JavaScript脚本代码，

2、当该文本发生改变或者事件被触发时，浏览器执行该代码并进行相应的处理操作，而响应某个事件而进行的处理过程称为事件处理。5.1浏览器中的事件第5章事件处理HTML文档事件可以分为浏览器事件和HTML元素事件两大类。在这里我们着重介绍浏览器事件。HTML文档将元素的常用事件（如onclick、onmouseover等）当作属性捆绑在HTML元素上，当该元素的特定事件发生时，对应于此特定事件的事件处理器就被执行，并将处理结果返回给浏览器。事件捆绑则将特定的代码放置在其所处对象的事件处理器中。浏览器事件指载入文档

3、直到该文档被关闭期间的浏览器事件，如浏览器载入文档事件onload、关闭该文档事件onunload、浏览器失去焦点事件onblur、获得焦点事件onfocus等。第6章面向对象的高级应用及C#语法新特性5.1浏览器中的事件第5章事件处理【例5-1】浏览器中的事件。window.onload=function(){varmsg="window.load事件:";msg+="浏

4、览器载入了文档!";alert(msg);}window.onfocus=function(){varmsg="window.onfocus事件:";msg+="浏览器取得了焦点!";alert(msg);}window.onblur=function(){varmsg="window.onblur事件:";msg+="浏览器失去了焦点!";alert(msg);}5.1浏览器中的事件第5章事件处理window.onscroll=function(){varmsg="wind

5、ow.onscroll事件:";msg+="用户拖动了滚动条!";alert(msg);}window.onresize=function(){varmsg="window.onresize事件:";msg+="用户改变了窗口尺寸!";alert(msg);}5.1浏览器中的事件第5章事件处理window.onscroll=function(){varmsg="window.onscroll事件:";msg+="用户拖动了滚动条!";alert(msg);}window.

6、onresize=function(){varmsg="window.onresize事件:";msg+="用户改变了窗口尺寸!";alert(msg);}5.1浏览器中的事件第5章事件处理

载入文档:

取得焦点:

失去焦点:

拖动滚动条:

变换尺寸:

7、cus事件；当该页面失去焦点时，触发window.onblur事件；当用户拖动滚动条时，触发window.onscroll事件；当用户改变文档页面大小时，触发window.onresize事件。5.2事件与DOM第5章事件处理JavaScript代码的核心是由事件把所有东西融合在一起。在一个设计良好的JavaScript应用程序里，都会拥有数据源（被解析为DOM的HTML文档）和它的视觉的表示（浏览器显示的HTML页面）。为了同步这两个方面，还必须监视用户的交互动作并试图相应地更新用户界面。DOM和Ja

8、vaScript事件的结合是任何现代Web应用程序赖以工作的至关重要的组合。事件是DOM的一部分，在DOMLevel1中未定义任何事件，只在DOMLevel2中才定义了一小部分子集，完整的事件是在DOMLevel3中规定的。由于早前没有标准指导，事件都是由浏览器开发者自己发明的模型实现的。尽管事件在不同的浏览器之间存在不同的DOM实现，但一些基本的性质还是相同的。下面我们看看在DOM事件处理中的一些关键技术。5.2事件与DOM第5章事件处理