掌握事件驱动编程-视频教学，理解事件处理程序、事件对象

视频教学资源

理解事件驱动编程

理解事件

理解事件处理程序

掌握常见的事件

理解事件对象

掌握事件对象的属性和方法

请在预习前完成下列单词，将单词写在横线上。

mousedown（[maʊs daʊn]鼠标按下）：___________________________________

mouseover（['əʊvə（r）'əʊvə（r）]鼠标在……之上）：___________________________

mousemove（[maʊs mu：v]鼠标在……之上移动）：___________________________

dblclick（[dblk'lɪk]鼠标双击）：_______________________________________

keypress（[ki：pres]击键）：__________________________________________

resize（[ˌri：ˈsaɪz]改变大小）：____________________________________________

focus（['fəʊkəs]聚焦，把焦点赋予……）：_______________________________

change（[tʃeindʒ]改变，变换）：_______________________________________

attach（[ə'tætʃ]附加）：______________________________________________

listener（[ˈlɪsənə（r）]监听者，监听器）：________________________________

keyCode（[ki：kəʊd]键码，键的代码）：__________________________________

prevent（[prɪ'vent]忽略，取消）：______________________________________(www.xing528.com)

1.以下有关事件引发的说法，正确的是（）。（选择一项）

A.onmouseup事件在鼠标移动到页面元素表面时引发

B.onmouseout事件在文本框失去焦点时引发

C.列表框的选项发生切换时，将引发onchange事件

D.用鼠标单击文本框，一定会引发它的onfocus事件

2.以下有关事件的说法，错误的是（）。（选择一项）

A.事件处理程序是指在事件引发时对此事件做出响应的代码

B.在<script></script>脚本块中，为特定的对象调用attachEvent（）方法可将事件处理程序与对象的事件绑定，但此方法不能在FireFox浏览器中使用

C.在<script></script>脚本块中，为特定的对象调用addEventListenter（）方法可将事件处理程序与对象的事件绑定，要求此方法的第一个参数必须是以“on”作为前缀的事件名称字符串

D.在<script></script>脚本块中，如果将一个函数作为某个对象的事件属性的值，则在赋值时，此函数仅给出函数名称，不能带有小括号，也不能传参数

3.以下有关事件对象的说法，错误的是（）。（选择一项）

A.事件对象用于获取与此次事件相关的信息

B.在IE浏览器中，事件处理程序要获得事件对象，可以访问window对象的event属性，即window.event

C.使用事件对象的keyCode属性，可以在onkeypress事件的处理程序中获取引发此次事件的键的字符Unicode码

D.要在事件处理程序中获得事件源，即引发此次事件的对象，在IE浏览器中，可访问事件对象的target属性，在非IE的其他浏览器中，可访问事件对象的srcElement属性

4.实现一个淘宝注册页面，使用JavaScript验证数据的有效性。用户名和密码不能为空，密码长度不能小于6位，两次密码输入必须一致。爱好需要选择其中一个，需要填写正确的出生年月。仔细阅读淘宝协议，如果没有选中“已经阅读”复选框，则不能进行注册，如下图所示。（参考本章例7.9）

注册验证

5.实现一个网页，要求页面加载完成时，用户名文本框获得焦点。文本框获得焦点时，背景颜色为“#85b788”。在用户名文本框里按下回车键，密码文本框获得焦点；在密码文本框里按下回车键，登录按钮获得焦点；在登录按钮上按下回车键，则直接提交表单。效果如下图所示。（参考本章例7.10）

验证会员