JAVA Script 教程PPT.ppt

第5章事件和事件处理 2 5 1理解事件 5 1 1事件概述日常生活中的事件 地震 火灾 台风使用电脑时发生的事件 鼠标单击链接 鼠标右击对象 单击按钮 按钮失去焦点 3 5 1 2事件类型 P86表5 1中 第一列 HTML组件 即为事件类型 每一类组件对应若干个事件 每一类组件对应一个HTML标记 5 1 3事件处理器语法格式如下 4 5 2处理事件 其中 inputtype button 事件类型为按钮value click 按钮的键面字onClick alert 您单击了按钮 事件处理器 5 例5 1作为HTML属性的事件处理器 Example 作为HTML属性的事件处理器functionpm m alert m Example 作为HTML属性的事件处理器 6 通过JavaScript属性处理事件P91 将事件处理器作为JavaScript的属性 使程序像操作JavaScript属性一样来处理事件 用HTML属性指定的事件处理器为 同样的功能通过JavaScript属性指定事件处理器来实现 document forms 0 infoButton onclick function alert 按钮的click事件被触发 使用JavaScript的属性来表示事件处理器的好处 减少了HTML和JavaScript的混合使用 简洁明了 事件处理器的代码不必是确定的 可以根据需要动态创建和修改 7 5 3JavaScript中的事件处理 Example 链接的mouseOver事件functionpm m alert m Example 链接的mouseOver事件请把鼠标放过来 看看会发生什么事情 5 3 1处理链接事件例5 2 href 链接的写法见P135 8 5 3 2处理窗口事件例5 3 P93 Example 窗口的load和unload事件functionlh alert 窗口执行了load事件 functionulh alert 窗口执行了unload事件 Example 本窗口的load和unload事件 9 5 3 3处理图形事件例5 4 P94 Example 图形的load事件functionilh alert 图形加载完成 Example 图形的load事件 10 5 3 4处理图形映射事件例5 5 P95 Example 图形映射事件functionmh alert 您单击的是图形第二个映射区 Example 图形映射事件 11 5 3 5处理窗体事件例5 6 P97 Example 窗体事件functioncv s varlen s length for vari 0 i len i if s charAt i returnfalse returntrue 判断字符s是否为空 空为true 非空为false 12 5 3 5处理窗体事件例5 6 P97 functionokh if cv document test userName value alert 用户名称不能为空 elseif cv document test passWord value alert 用户密码不能为空 else alert 您填写正确 functionch document test userName value document test passWord value 13 5 3 5处理窗体事件例5 6 P97 Example 窗体事件用户名称 用户密码 nbsp nbsp nbsp nbsp nbsp nbsp nbsp nbsp 14 5 3 6处理错误事件例5 7 P99 Example 处理错误事件functioneh em url line va