javascript事件驱动及事件处理
1. 常用事件
常用的javascript事件可以分为鼠标事件、键盘事件、页面相关事件、表单相关事件等事件。
| 事件 | 事件关联的对象 | 描述 | |
|
鼠标键盘事件 |
onclick | link及所有表单(form)子组件 | 用户单击鼠标时触发的对象事件 |
| ondbclick | link及所有表单子组件 | 用户双击鼠标时触发的对象事件 | |
| onmousedown | document，link及所有表单子组件 | 用户按下鼠标时触发的对象事件 | |
| onmouseup | document，link及所有表单子组件 | 用户鼠标按下后松开鼠标时触发的对象事件 | |
| onmouseover | document，link及所有表单子组件 | 当用户鼠标移动到某个对象范围的上方时触发该对象时间 | |
| onmousemove | document，link及所有表单子组件 | 用户鼠标移动时触发的对象事件 | |
| onmouseout | document，link及所有表单子组件 | 当用户鼠标离开某对象范围时触发的对象事件 | |
| onkeypress | image，link及所有表单子组件 | 当用户键盘上某个按键按下并且释放时触发的对象事件 | |
| onkeydown | image，link及所有表单子组件 | 当用户键盘上某个按键按下时触发的对象事件 | |
| onkeyup | image，link及所有表单子组件 | 当用户键盘上某个按键按下后松开时触发的对象事件 | |
| 页面相关事件 | onabort | image | 当图形尚未完全加载前，用户就单击了一个超链接，或单击停止按钮时触发的事件 |
| onerror | image，window | 加载文件或图像发生错误时触发此事件 | |
| onload | document | 页面内容加载完成时触发此事件 | |
| onresize | window | 当浏览器的窗口大小被改变时触发此事件 | |
| onunload | document | 当页面关闭或退出时触发此事件 | |
| 表单相关事件 | onblur | window及所有表单子组件 | 当前对象元素失去焦点时触发此事件 |
| onchange | window及所有表单子组件 | 当前对象元素失去焦点并且元素的内容发送改变时触发此事件 | |
| onfocus | window及所有表单子组件 | 当某个对象元素获得焦点时触发此事件 | |
| onreset | form表单 | 当表单中Reset的属性被激活时触发此事件 | |
| onsubmit | form表单 | 一个表单被提交时触发此事件 | |
<html>
<head>
<meta http-equiv="Content-Type" content="text/html"; charset="UTF-8">
<title>事件处理综合示例</title>
</head>
<body>
<font style="cursor: hand;"
onclick="location='http://www.baidu.com'"
onmouseover="status='hello';this.color='red'"
onmouseout="status='';this.color='blue'">hello</font>
</body>
</html>
2. 事件处理程序
事件处理程序就是当某个事件发生后，处理事件的程序或函数。
事件处理过程定义方式：在每一种事件名称前面加上on即可，如：onLoad，onClick。
调用事件处理程序常见方式有以下两种。
(1)将事件处理程序视为标记的事件属性的属性值，直接嵌入到html的标记内，例如：
<body onLoad="alert('hello')">
(2)将事件处理程序视为对象属性的属性值，例如：
<script>
document.onLoad=alert("hello");
</script>
