微机辅助教学暨多媒体CAI省公共课一等奖全国赛课获奖课件.pptx

2010 WEB by 7RemainderJS&review第1页2010 WEB by 关于时间安排本节课结束课程内容部分下周总结复习结课答疑考试安排在5、1后戒躁推迟考试，因为内容更主要本节课重点：JS实例第2页2010 WEB by Final版作业要求已申请作业汇展空间（批复ing）每位同学作业都将上传（预期）安全性要求：无下载链接无媒体文件上传（音乐等可采取绝对地址链接到外部媒体地址）无个人blog类链接Js代码部分要求由DW生成或手写代码第3页2010 WEB by remind Something适当公布个人信息不要过于详细地址电话可能被择优，持日常心优异是一个习惯没有最好，只有更加好第4页2010 WEB by submit截止5、1前（第九周）网站文件夹打包为rar，文件名为：学号姓名学号姓名.rar除图片外不要附加其它媒体文件第5页2010 WEB by 现阶段作业：doc版仍要，截屏，代码，描述（许多效果需要加个注解）链接到外部CSS，要提交CSS代码初级阶段同学，抓紧改造Bug问题，CSS兼容性还是很复杂，比如lovehate次序，doctype定义，charset写法第6页2010 WEB by 1.检验HTML元素是否有拼写错误、是否忘记结束标识2.检验CSS是否正确3.确定错误发生位置4.利用border属性确定犯错元素布局特征5.float元素父元素不能指定clear属性6.float元素务必指定width属性第7页2010 WEB by 7.float元素不能指定margin和padding等属性8.float元素宽度之和要小于100%9.是否重设了默认样式?10.是否忘记了写DTD（文档类型定义）?第8页2010 WEB by Web标准化WEB标准不是某一个标准，而是一系列标准集合。网页主要由三部分组成：结构（结构（Structure）、表现）、表现（Presentation）和行为）和行为（Behavior）。）。对应标准也分三方面：结构化标准语言主要包含XHTML和XML，表现标准语言主要包含CSS，行为标准主要包含对象模型（如W3CDOM）、ECMAScript等。这些标准大部分由W3C起草和公布，也有一些是其它标准组织制订标准，比如ECMA（EuropeanComputerManufacturersAssociation）ECMAScript标准。第9页2010 WEB by Web标准化第10页2010 WEB by Web标准化第11页2010 WEB by 更主要是语义结构化外观并不是最主要。一个结构良好HTML页面能够以任何外观表现出来把Web标准化进行得更彻底一点，一定让你受益匪浅。第12页2010 WEB by JavaScriptWeb行为层实现Continue第13页2010 WEB by review关键基础问题：弱变量类型基于对象动态联编关键语法和CSS部分一样，用注释包围，以向下兼容基本语句、变量类似java第14页2010 WEB by 内嵌内嵌JavaScript代码和外部代码和外部程序程序 /JavaScript Appears here.alert(这是第一个这是第一个JavaScript例子例子!);alert(欢迎你进入欢迎你进入JavaScript世界世界!);alert(我们共同学习我们共同学习JavaScript知识！知识！);使用SRC=URL属性 使用language=“JavaScript”属性 在HTML中，JavaScript源码用中注释，其好处为：对于不能解释浏览器不执行代码，而对于能够解释JavaScript浏览器不会受到任何妨碍。第15页2010 WEB by 对象基本知识对象基本知识 对象是能够从 JavaScript“势力范围”中划分出来一小块，能够是一段文字、一幅图片、一个表单（Form）等等。每个对象有它自己属性、方法和事件。对象属性是反应该对象一些特定性质，比如：字符串长度、图像长宽、文字框（Textbox）里文字等等；对象方法能对该对象做一些事情，比如，表单“提交”(Submit)，窗口“滚动”(Scrolling)等等；而对象事件就能响应发生在对象上事情，比如提交表单产生表单“提交事件”，点击连接产生“点击事件”。不是全部对象都有以上三个性质，有些没有事件，有些只有属性。引用对象任一“性质”用“.”这种方法。第16页2010 WEB by 关于对象化编程语句关于对象化编程语句 this 对象对象 返回“当前”对象。在不一样地方，this 代表不一样对象。假如在 JavaScript“主程序”中（不在任何 function 中，不在任何事件处理程序中）使用 this，它就代表 window 对象；假如在 with 语句块中使用 this，它就代表 with 所指定对象；假如在事件处理程序中使用 this，它就代表发生事件对象。一个惯用this使用方法：.functioncheck(formObj).这个使用方法惯用于立刻检测表单输入有效性。第17页2010 WEB by JavaScript实战（代用部分DOM）第18页2010 WEB by 19JavaScript对象继承关系第19页2010 WEB by 3 JavaScript中对象JavaScript中浏览器对象 因为JavaScript在网页中使用，网页经过浏览器浏览，在浏览器中打开一个页面时浏览器会自动创建一些对象，这些对象存放了HTML页面属性和其它相关信息，这些对象在浏览器上运行，所以我们把它们称为浏览器对象。浏览器对象主要有navigator、Window、document、location和history对象。对象之间有隶属关系，Window对对象象是是其其它它部部分分祖祖先先，其子对象包含location对象、document对象和history对象。在程序中子对象被认为是父对象属性。比如，要引用document对象，应该用格式：Window.document。下面分别介绍这些对象。1Window对象 Window对象反应是一个完整浏览器窗口。只要浏览器窗口打开，即使浏览器中没有加载任何页面，JavaScript也会建立这个对象。Window对象提供了处理浏览器窗口方法和属性。该对象对应于HTML文档中和两种标识。第20页2010 WEB by 3 JavaScript中对象JavaScript中浏览器对象（1）Window对象惯用属性：Closed属性：判断一个窗口是否关闭。frames属性：统计当前窗口中全部帧信息，是一个frame对象数组。parent属性：指明当前窗口或帧父窗口。defaultstatus属性：默认状态，它值显示在窗口状态栏中。status属性：状态栏中当前显示信息。top属性：定义是一系列浏览器上层浏览器窗口。window属性：指是当前窗口。self属性：引用当前文档对应窗口。history属性：提供当前窗口历史纪录，可在网页导航中发挥作用。Location属性：提供当前窗口URL信息。Locationbar属性：代表浏览器地址栏。第21页2010 WEB by 3 JavaScript中对象JavaScript中浏览器对象（2）Window对象惯用方法：open()方法：用于创建一个新窗口或在指定命令窗口内打开页面。打开窗口基本格式：Window.open(URL,窗口名字窗口名字,窗口属性窗口属性)。close()方法：用于关闭一个浏览器窗口。alert(字符串字符串)方法：用于弹出一个警告框，在警告框内显示字符串文本。方法：用于弹出一个警告框，在警告框内显示字符串文本。confirm(字符串)方法：用于弹出一个确定框，在确定框内显示字符串文本。通常在用户决定一些行动是否采取时使用。prompt(字字符符串串，缺缺省省值值)方方法法：用用于于弹弹出出一一个个提提醒醒框框，提提醒醒框框中中显显示示字字符符串串，而而且且在在提提醒醒框框中中有有一一个个文文本本框框要要求求用用户户输输入入信信息息。假假如如用用户户修修改改输输入入文文本本框框内内文文本本后后单单击击“确确定定”按按钮钮，则则返返回回用用户户输输入入字字符符串串。假假如如用用户户单单击击“取消取消”按钮，则返回按钮，则返回null值。值。back()方法：用于指示浏览器载入历史纪录上一个URL地址，相当于浏览器工具栏中后退按钮。forward()方法：用于指示浏览器载入历史纪录下一个URL地址，相当于浏览器工具栏中前进按钮。home()方法：用于指示浏览器载入预先设定主页页面，相当于浏览器工具栏中返回主页按钮。第22页2010 WEB by 提醒窗口例提醒窗口例:function ShowWindows(n)function ShowWindows(n)if(n=1)window.prompt(if(n=1)window.prompt(这是第一个窗口这是第一个窗口,北京北京););else if(n=2)window.prompt(else if(n=2)window.prompt(这是第二个窗口这是第二个窗口,上海上海););else if(n=3)window.prompt(else if(n=3)window.prompt(这是第三个窗口这是第三个窗口,南京南京););else window.prompt(else window.prompt(这是第一个窗口这是第一个窗口););input type=button value=onclick=ShowWindows(1)input type=button value=onclick=ShowWindows(2)input type=button value=onclick=ShowWindows(3)第23页2010 WEB by 警示窗口例：警示窗口例：创建一个按钮，当单击该按钮时在警示窗口中显示系统时间。创建一个按钮，当单击该按钮时在警示窗口中显示系统时间。!-/-JavaScriptJavaScript示例示例input type=Button onclick=showdate();value=第24页2010 WEB by 3 JavaScript中对象JavaScript中浏览器对象 2document对象 存放着当前页一些信息，代表是当前整个页面，页面前景色、背景色、链接颜色、表单、图像等都作为document对象属性存在。（1）document对象属性 title属性：指出文档标题，相当于HTML文档中之间内容。lastModified属性：指出文档最终修改日期。bgcolor属性：指出文档背景色，相当于HTML中bgcolor属性。fgcolor属性：指出文档前景色，相当于HTML中text属性。alinkColor属性：指出鼠标单击时链接颜色。vlinkColor属性：指出已访问过链接颜色。links属性：数组，存放文档中全部链接对象，每个数组元素是一个链接对象。第25页2010 WEB by 3 JavaScript中对象JavaScript中浏览器对象 Images属性：数组，存放文档中全部图形对象，每个数组元素是一个图形对象。URL属性：指出文档对应URL地址。（2）document对象主要方法 write(字符串)：将字符串写到一个新文档。能够是字符串常量或者是字符串变量。writeln(字符串)：将字符串写到一个新文档，并在字符串末尾加上换行符。clear()：去除文档当前内容。Open()和close()：打开一个新文档和关闭当前文档。最好先用Open()方法打开一个文档，然后再用write()或者writeln()方法写入，写入完成后，再用close()方法关闭。第26页2010 WEB by 一个简单一个简单JavaScriptJavaScript程序程序 JavaScript Demo1 JavaScript Demo1 document.writeln(document.writeln(欢迎使用欢迎使用JavaScriptJavaScript！););document.writeln();document.writeln();document.writeln(document.writeln(轻轻我走了，正如我轻轻也来轻轻我走了，正如我轻轻也来););document.writeln(document.writeln(挥一挥衣袖，作别西天云彩挥一挥衣袖，作别西天云彩););第27页2010 WEB by 利用输入、输出方法实现交互在JavaScript中，能够利用prompt()方法和write()方法实现与Web页面用户进行交互。相关交互例子相关交互例子!-/Hide From Other Browsersdocument.write(欢迎你，亲爱：欢迎你，亲爱：);my=prompt(请输入你用户名请输入你用户名:);document.write(my+);document.close();/Stop Hiding from Other Browsers-从上面程序能够看出：可经过write()和prompt()方法实现交互。在JavaScript脚本语言中能够使用HTML标识语言代码，从而实现混合编程。第28页2010 WEB by 3 JavaScript中对象JavaScript中浏览器对象 3location对象 提供当前页面URL信息。它有一组属性，用于存放URL各个组成部分。它方法能够重装当前页面或装入新页面。比如：http:/:80/book/1.html#section1 协议名称为http，主机名称为，端口号为80，页面地址为book/1.html，在页面中有一个页面内跳转锚标，名称为section1。（1）location对象属性 Hash属性：假如页面中有页面内跳转锚标，则Hash属性返回HREF中#号后面字符串。如上例中用location.hash能够取得锚标为#section1。Host属性：提供URL页面所在Web服务器主机名称和端口号。如上例中用location.host能够取得：80。Hostname属性：提供URL主机名称部分。如上例中。第29页2010 WEB by 3 JavaScript中对象JavaScript中浏览器对象 Href属属性性：提提供供整整个个URL。如如上上例例中中 http:/:80/book/1.html#section1。Pathname属性：提供文档在主机上路径及文件名。如上例中属性：提供文档在主机上路径及文件名。如上例中book/1.html。Port属性：返回属性：返回URL中端口号部分。如上例中中端口号部分。如上例中80。Protocol属性：指定协议名称。属性：指定协议名称。Search属属性性：提提供供完完整整URL中中“？”号号后后面面查查询询字字符符串串。在在浏浏览览网网页页时时常常会会发发觉觉搜搜索索站站点点页页面面URL中中问问号号“？”后后还还有有一一些些信信息息，这这些些信信息息往往往往是是提提交到服务器上进行搜索信息。交到服务器上进行搜索信息。（2）location对象方法对象方法 reload()方方法法：刷刷新新当当前前页页面面，相相当当于于工工具具栏栏上上刷刷新新按按钮钮。比比如如定定义义一一个个刷刷新新 页页 面面 按按 钮钮，格格 式式 为为：replace(URL地址地址)方法：用指定方法：用指定URL地址代替当前页面。地址代替当前页面。Assign(URL地址地址)方法：将当前页面导航到指定方法：将当前页面导航到指定URL地址上去。地址上去。第30页2010 WEB by 3 JavaScript中对象JavaScript中浏览器对象 4history对象 history对象存放着最近访问过URL地址。它有一个length属性，用于统计该对象存放URL地址个数。history对象方法：（1）back()方法：装入历史清单中上一个URL文档，相当于浏览器后退按钮。（2）forward()方法：装入历史清单中下一个URL文档，对应浏览器前进按钮。（3）go(n)方法：装入历史清单中指定位置文档，假如指定是一个整数，表示向前进，假如是一个负数，表示向后退。go(-1)功效和back()方法功效是一样。5navigator对象 保留浏览器厂家、版本和功效信息。navigator惯用属性以下：appCodeName属性：提供当前浏览器代码名。appName属性：提供当前浏览器名称。appVersion属性：提供当前浏览器版本号。userAgent属性：反应浏览器完整用户代理标识。navigator还有一个javaEnabled()方法，用于指出在浏览器中是否能够使用Java语言，该方法返回值是一个布尔值。第31页2010 WEB by navigator对象例浏览器信息搜集浏览器信息搜集第32页2010 WEB by 浏览器名称inputtype=textname=Namesize=50浏览器版本inputtype=textname=Versionsize=50浏览器代码名称inputtype=textname=Codesize=50代理商名称inputtype=textname=Agentsize=50第33页2010 WEB by 3 JavaScript中对象JavaScript中浏览器对象 document子对象 document子对象包含link对象、anchor对象和form对象。link对象：包含链接信息，能够用links数组访问link对象，数组中每个元素都是当前页中一个link对象。比如，把当前页面中第一个链接对象URL地址赋给变量link1，格式为：link1=document.links0.href;anchor对象：代表当前文档中一个链接点，用数组links来访问。form对象：代表文档中表单。用数组forms来访问。第34页2010 WEB by 4 JavaScript中事件 JavaScript是是基基于于对对象象(object-based)语语言言，而而基基于于对对象象基基本本特特征征就就是是采采取取事事件件驱驱动动(event-driven)。事事件件定定义义了了用用户户与与Web页页面面交交互互时时产产生生各各种种动动作作。通通常常我我们们把鼠标或热键动作称之为事件（把鼠标或热键动作称之为事件（Event），比如，单击一个按钮就产生一个事件。），比如，单击一个按钮就产生一个事件。在在JavaScript中中，对对象象事事件件处处理理通通常常由由函函数数来来完完成成，所所以以事事件件处处理理程程序序基基本本格格式式与与函数全部一样。格式以下：函数全部一样。格式以下：Function 事件处理名（参数表）事件处理名（参数表）事件处理语句集；事件处理语句集；归纳起来，必须使用事件有三大类：归纳起来，必须使用事件有三大类：1引发页面之间跳转事件，主要是超链接事件。引发页面之间跳转事件，主要是超链接事件。2事件浏览器自己引发事件。事件浏览器自己引发事件。3事件在表单内部与界面对象交互引发事件。事件在表单内部与界面对象交互引发事件。句句柄柄是是一一个个 32 位位正正整整数数，用用来来存存放放特特定定事事件件处处理理函函数数，识识别别窗窗体体或或其其它它对对象象，如如字字体体或或位位图图。Windows 给给每每个个窗窗口口一一个个唯唯一一句句柄柄，经经过过句句柄柄操操纵纵该该窗窗口口。一一个个句句柄柄名字是在对应名字是在对应事件名字之前加上事件名字之前加上on，如处理，如处理Load事件句柄通常是事件句柄通常是onLoad。第35页2010 WEB by 4 JavaScript中事件事件处理概述事件处理概述事件处理是对象化编程一个很主要步骤，没有事件处理是对象化编程一个很主要步骤，没有了事件处理，程序就会变得很死，缺乏灵活性。事件了事件处理，程序就会变得很死，缺乏灵活性。事件处理过程能够这么表示：发生事件处理过程能够这么表示：发生事件-开启事件处理程开启事件处理程序序-事件处理程序作出反应。其中，要使事件处理程事件处理程序作出反应。其中，要使事件处理程序能够开启，必须先告诉对象，假如发生了什么事情，序能够开启，必须先告诉对象，假如发生了什么事情，要开启什么处理程序，不然这个流程就不能进行下去。要开启什么处理程序，不然这个流程就不能进行下去。事件处理程序能够是任意事件处理程序能够是任意 JavaScript JavaScript 语句，不过我语句，不过我们普通用特定自定义函数（们普通用特定自定义函数（functionfunction）来处理事情。）来处理事情。第36页2010 WEB by 4 JavaScript中事件指定事件处理程序指定事件处理程序指定事件指定事件处处理程序有三种方法：理程序有三种方法：方法一方法一 直接在直接在 HTML 标识标识中指定中指定。方法：。方法：.让让我我们们来看看例子：来看看例子：body.onload=alert()这么定义这么定义标识，能使文档读取完成时候弹出一个对话框，标识，能使文档读取完成时候弹出一个对话框，写着写着“网页读取完成，请慢慢观赏网页读取完成，请慢慢观赏”；在用户退出文档（或者关；在用户退出文档（或者关闭窗口，或者到另一个页面去）时候弹出闭窗口，或者到另一个页面去）时候弹出“再见再见”。第37页2010 WEB by 4 JavaScript中事件方法二方法二 编编写特定写特定对对象特定事件象特定事件 JavaScript。这这种方法用得比种方法用得比较较少，不少，不过过在一些在一些场场所所还还是很好用。是很好用。方法是：方法是：script language=JavaScript for=.(事件事件处处理程序代理程序代码码).例：例：alert(alert(网网页读页读取完成，取完成，请请慢慢慢慢观赏观赏！););第38页2010 WEB by 4 JavaScript中事件方法三方法三 在在 JavaScript 中中说说明。明。方法：方法：.=;用用这这种方法要注意是，种方法要注意是，“事事件件处处理程序理程序”是真正代是真正代码码，而不是字符串形式代而不是字符串形式代码码。假如事件假如事件处处理程序是一个理程序是一个自定自定义义函数，如无使用参函数，如无使用参数需要，就不要加数需要，就不要加“()”“()”。例：例：.function ignoreError()function ignoreError()return true;return true;.window.onerror=ignoreError;/window.onerror=ignoreError;/没有使用没有使用“()”“()”这个例子将这个例子将 ignoreError()函数定义函数定义为为 window 对象对象 onerror 事件处理程事件处理程序。它效果是忽略该序。它效果是忽略该 window 对象下对象下任何错误（由引用不允许访问任何错误（由引用不允许访问 location 对象产生对象产生“没有权限没有权限”错误是错误是不能忽略）。不能忽略）。第39页2010 WEB by 4 JavaScript中事件 浏览器事件 惯用浏览器事件有Load、Unload和Submit。1Load事件 当浏览器装载网页时会触发Load事件。这个事件处理函数在其它全部JavaScript程序和网页之前被执行，用来完成网页中全部数据初始化、弹出提醒窗口或密码确认窗口。通常在标识中使用这个事件句柄。2Unload事件 Unload事件与Load事件恰好相反，当卸载一个页面时会发生Unload事件，即在浏览器载入一个新网页之前或当用户退出文档时触发 unload 事件。onUnload 用在 BODY 或 FRAMESET 标签上。如。3Submit事件 当用户完成信息输入提交表单时发生该事件。通常在标签中使用onSubmit句柄。当用户提交表单时，JavaScript调用Submit事件处理函数，对表单数据进行验证，假如全部数据验证都能经过，时间处理函数就返回true，将表单提交到服务器。假如返回false，则不进行提交，并给出提醒信息，让用户重新输入数据。第40页2010 WEB by 4 JavaScript中事件 键盘事件 惯用键盘事件有KeyDown、KeyPress和KeyUp事件。1KeyDown事件 当用户按下一个键时会发生该事件。KeyDown事件总是发生在KeyPress事件之前，假如KeyDown事件处理函数返回false，则KeyPress事件不会发生。当KeyDown事件发生时，JavaScript会自动调用onKeyDown句柄。KeyDown事件适用对象有document、Image（图像）、Link（超级链接）、Textarea（文本区域）。2KeyPress事件 当用户按下一个键时触发该事件，当KeyDown事件处理函数返回值为true时KeyPress事件接着发生。当用户按着一个键不松开时，KeyPress事件会不停发生。当KeyPress事件发生时，JavaScript会自动调用onKeyPress句柄。KeyPress事件适用对象有document、Image、Link、Textarea。3KeyUp事件 当用户释放键盘上一个键时触发KeyUp 事件。当KeyUp事件发生时，JavaScript会自动调用onKeyUp句柄。KeyUp事件适用对象有document、Image、Link、Textarea。第41页2010 WEB by 4 JavaScript中事件 鼠标事件 惯 用 鼠 标 事 件 有 MouseDown、MouseUp、MouseOver、MouseMove、MouseOut、Click、Blur、Change、Move、Select和Focus事件。在鼠标事件发生时，鼠标事件信息被作为一个参数传送给鼠标事件处理函数。1MouseDown事件 当用户按下鼠标按钮时触发 MouseDown 事件。若 MouseDown 事件处理函数返回 false 话，缺省操作(拖放、选择文本或激活超级链接)将被取消。MouseDown事件发生时JavaScript会自动调用on MouseDown句柄。该事件适用对象Button，document，Link。2MouseUp事件 当用户释放鼠标按钮时会触发该事件。假如MouseUp事件处理函数返回false话，缺省操作(拖放、选择文本或激活超级链接)将被取消。当 MouseUp处理函数在一个被捕捉链接上返回false，链接将不会被触发，捕捉是因为在链接上发生了MouseDown事件。当MouseUp事件发生时JavaScript会自动调用onMouseUp句柄。该事件适用对象为Button，document，Link。第42页2010 WEB by 4 JavaScript中事件 鼠标事件 3MouseOver事件 当鼠标经过某个对象或区域时触发该事件。MouseOver事件发生时JavaScript会自动调用onMouseOver句柄。该事件适用对象有Layer、Link和区域。上网时经常发觉当鼠标经过一个超链接时，状态栏中会显示超链接目标。要想不让浏览器在状态栏中显示超链接目标，必须在该事件处理函数最终使用return true语句，即让处理函数返回true值。比如，想让鼠标经过超链接时在状态栏中显示“你好，要看超链接吗？”，用以下格式：请点击进入baidu搜索 第43页2010 WEB by 4 JavaScript中事件 鼠标事件 4MouseMove事件 用户移动鼠标指针时触发该事件。因为鼠标移动发生太频繁了，所以缺省情况下 onMouseMove 不是任何对象事件，只有当对象要求捕捉事件时，这个时间才会在移动鼠标是发生。当MouseMove事件发生时，JavaScript会自动调用onMouseMove句柄。5MouseOut事件 当每次鼠标指针离开区域或链接时触发 MouseOut 事件。比如鼠标指针从客户端图像地图一个区域移到了另外一个区域，则第一个区域会收到 onMouseOut 事件，而第二个区域会收到 onMouseOver 事件。当MouseOut事件发生时，JavaScript会自动调用onMouseOver句柄。该事件适用对象有Layer、Link和区域。第44页2010 WEB by 【例】【例】将鼠标移到一个链接时，超链接文字将放大显示，同时改变颜色。将鼠标移到一个链接时，超链接文字将放大显示，同时改变颜色。强调链接强调链接 function link1Over()function link1Over()link1.style.color=red;link1.style.color=red;link1.style.fontSize=36;link1.style.fontSize=36;function link1Out()function link1Out()link1.style.color=black;link1.style.color=black;link1.style.fontSize=16;link1.style.fontSize=16;指向超链时放大该超链接。指向超链时放大该超链接。a href=http:/ name=link1 onmouseover=link1Over()onmouseout=“link1Out()”数信学院数信学院 第45页2010 WEB by 4 JavaScript中事件 鼠标事件 6.Click事件 当用户单击按钮时触发该事件，同时onClick指定事件处理程序或代码将被执行。该事件适合用于button（按钮对象）、checkbox（复选框）、radio（单项选择钮）、reset buttons（重置按钮）、submit buttons（提交按钮）等对象。相关Click事件我们在前面例子中已屡次使用。7Blur事件 当表单中元素或window、frame失去焦点时会发生该事件（既使其值没有改变）。同时onBlur指定事件处理程序或代码将被执行。该事件适合用于Button、Checkbox、FileUpload、Layer、Password、Radio、Reset、Select、Submit、Text、Textarea和Window。8Change事件 当一个选择框、文本框或者文本输入区域失去焦点而且其中值发生改变时会发生该事件，同时onChange指定事件处理程序或代码将被执行。该事件适合用于 Text、Textarea和Select。第46页2010 WEB by 4 JavaScript中事件 鼠标事件 9Move事件 当用户或者脚本程序移动窗口或框架时触发move事件，同时onMove指定事件处理程序或代码将被执行。该事件适合用于对象window以及帧。10Select事件 当Text或Textarea对象中文字被选定之后引发该事件。同时onSelect指定事件处理程序或代码将被执行。该事件适合用于对象Text、Textarea。11Focus事件 当一个选择框、文本输入框或者文本输入区域得到焦点时触发该事件。同时onFocus指定事件处理程序或代码将被执行。该事件适合用于对象Text、Textarea或选择框。常在这个事件处理函数中加入一些提醒信息，当指向这个对象并单击时就能够得到一些提醒。onFocus句柄与onBlur句柄功效恰好相反。第47页2010 WEB by 事件处理详解事件处理详解onblur 事件事件 发发生在窗口失去焦点生在窗口失去焦点时时候。候。应应用于：用于：window window 对对象象onchange 事件事件 发发生在文本生在文本输输入区内容被更改，然入区内容被更改，然后焦点从文本后焦点从文本输输入区移走之后。捕捉此事件主要用于入区移走之后。捕捉此事件主要用于实时检测输实时检测输入有效性，或者立刻改入有效性，或者立刻改变变文档内容。文档内容。应应用于：用于：Password Password 对对象；象；Select Select 对对象；象；Text Text 对对象；象；Textarea Textarea 对对象象第48页2010 WEB by 事件处理事件处理 onclick 事件事件 发发生在生在对对象被象被单击时单击时候。候。单击单击是指鼠是指鼠标标停留停留在在对对象上，按下鼠象上，按下鼠标键标键，没有移，没有移动动鼠鼠标标而放开鼠而放开鼠标键这标键这一个完一个完整整过过程。程。一个普通按一个普通按钮对钮对象（象（ButtonButton）通常会有）通常会有 onclick onclick 事件事件处处理程序。按理程序。按钮钮上添加上添加 onclick onclick 事件事件处处理程序，能理程序，能够够模模拟拟“另一另一个提交按个提交按钮钮”，方法是：在事件，方法是：在事件处处理程序中更改表理程序中更改表单单 action,action,target,encoding,method target,encoding,method 等一个或几个属性，然后等一个或几个属性，然后调调用表用表单单 submit()submit()方法。方法。在在 Link Link 对对象象 onclick onclick 事件事件处处理程序中返回理程序中返回 false false 值值（return falsereturn false），能阻止），能阻止浏览浏览器打开此器打开此连连接。接。应应用于：用于：Button Button 对对象；象；Checkbox Checkbox 对对象；象；Image Image 对对象；象；Link Link 对对象；象；Radio Radio 对对象；象；Reset Reset 对对象；象；Submit Submit 对对象象第49页2010 WEB by 事件处理事件处理 onerror 事件事件 发发生在生在错误发错误发生生时时候。它事件候。它事件处处理程序理程序通常就叫做通常就叫做“错误处错误处理程序理程序”(Error Handler)”(Error Handler)，用来，用来处处理理错误错误。上上边边已已经经介介绍过绍过，要忽略一切，要忽略一切错误错误，就使用：，就使用：function ignoreError()function ignoreError()return true;return true;window.onerror=ignoreError;window.onerror=ignoreError;应应用于：用于：window window 对对象象onfocus 事件事件 发发生在窗口得到焦点生在窗口得到焦点时时候。候。应应用于：用于：window window 对对象象第50页2010 WEB by 事件处理事件处理 onload 事件事件 发发生在文档全部下生在文档全部下载载完成完成时时候。全部下候。全部下载载完成意味着不但完成意味着不但 HTML HTML 文件，而且包含文件，而且包含图图片，插件，控件，小片，插件，控件，小程序等全部内容都下程序等全部内容都下载载完成。本事件是完成。本事件是 window window 事件，不事件，不过过在在 HTML HTML 中指定事件中指定事件处处理程序理程序时时候，我候，我们们是把它写在是把它写在标识标识中。中。应应用于：用于：window window 对对象象onmousedown 事件事件 发发生在用生在用户户把鼠把鼠标标放在放在对对象上按下象上按下鼠鼠标键时标键时候。参考候。参考 onmouseup onmouseup 事件。事件。应应用于：用于：Button Button 对对象；象；Link Link 对对象象onmouseout 事件事件 发发生在鼠生在鼠标标离开离开对对象象时时