JavaScript-5.ppt

JavaScrpt中的事件处理 处理窗口事件 窗口事件主要用来处理普通的HTML文档以及包含帧结构的HTML文档，常用的有load、unload、blur、focus等事件。 JavaScrpt中的事件处理 处理图形事件 图形事件用于了解图形的加载状况、判断加载过程中是否发生中断或者错误，从而构建丰富多彩的Web应用。下面是关于图形load事件的例子： JavaScrpt中的事件处理 处理图形映射事件 图形映射是一类比较特殊的图形事件，由分布在不同区域的图形组成，用户单击图形的某个区域，便可以连接与该区域相关的URL。 JavaScrpt中的事件处理 处理窗体事件 在JavaScript实际应用中，最常处理的事件就是窗体事件。 窗体提供了许多图形用户界面控件，帮助用户完成Web交互，例如：文本框、单选框、复选框、按钮等等。 JavaScrpt中的事件处理 处理窗体事件 JavaScrpt中的事件处理 处理窗体事件 当点击“确定”按钮时，将判断是否录入用户名称和密码，如果两者都录入内容将提示填写正确，否则提示信息缺失；点击“取消”按钮将把用户名称文本框和用户密码文本框内容清空。 JavaScrpt中的事件处理 处理错误事件 JavaScript1.1及其以后版本引入了error事件，提供了在脚本执行过程中处理错误的功能。 图像、窗口以及框架对象有error事件，其中image对象的onError事件处理器可以处理与加载图形相关的错误，而windows对象的onError事件处理器可以处理与加载文档相关的错误。 处理错误事件不同于处理其他事件，事件处理函数不需要自己编写，而是由浏览器自动执行，通过3个参数传递错误信息：第一个参数描述所发生错误的信息；第二个参数是一个URL，指明引起错误的JavaScript代码所在的文档；第三个参数是该文档中错误代码所在行的行号。 JavaScrpt中的事件处理 处理错误事件 JavaScrpt中的事件处理 处理错误事件 如果将错误事件处理函数的名称赋给了windows对象的onerror属性，那么发生的错误将会被处理。例如点击按钮时调用不存在的函数okHandle()： input type=button onClick = okHandle() value = 确 定 事件对象 JavaScript1.2引入了event对象作为提供事件细节信息的机制，由于event对象包含了若干存储着事件细节信息的属性，所以可以通过访问event对象的属性来获取所发生事件的详细信息。 Netscape公司和微软公司在其浏览器软件中都定义了event对象，但是在两家公司浏览器软件Navigator和Internet Explorer中，event对象的属性几乎完全不同。 在上面两种浏览器中，除了event对象的属性不同以外，事件处理器使用event对象的方法也存在很大差异： Internet Explorer将event对象定义为全局性的，可以从事件处理器中直接访问。 Navigator浏览器将event对象作为参数传递给事件处理器。 本章小结 事件是浏览器响应用户操作的机制，说明了用户与Web页面交互时产生的操作。 JavaScript中的事件大都与HTML标记相关，都是在用户操作页面元素是触发的。 JavaScript支持大量的事件类型，而且针对不同对象，同一操作也会产生不同的事件结果。 当JavaScript中定义的事件发生时，程序就会执行用于响应事件的JavaScript代码，响应特定事件的代码被称为事件处理器。 JavaScript的事件处理分为两个步骤：首先定义可以被JavaScript识别和处理的事件，然后由程序员使用标准的方法将事件和事件处理代码连接起来。 JavaScript 1.2引入了event对象作为提供事件细节信息的机制，由于event对象包含了若干存储着事件细节信息的属性，所以可以通过访问event对象的属性来获取所发生事件的详细信息。 思考题 JavaScript支持的事件包括什么？它们分别代表什么样的操作？ 什么是事件处理器？不同HTML元素支持的事件处理器分别是什么？ 如何通过HTML属性处理事件？如何通过JavaScript属性处理事件？ 什么是错误事件？如何处理错误事件？ 如何在程序中使用event对象，从而获取所发生事件的详细信息？ 软件职业技术学院 5.* JavaScript程序设计 第五章 事件和事件处理 本章结构 理解事件 处理事件 JavaScript中的事件处理 事件对象 理解事件 事件概述 事件是浏览器响应用户操作的机制，说明了用户与Web页面交互时产生的操作。 事件可以向浏览器表明有操作发生，需要浏览器处理。 浏览器可以监听事件，在事件发生时做出反