事件简单总结

标签：

一、事件驱动三要素

　　1.事件
　　2.事件源
　　3.事件处理程序
二、事件分类

　　A·鼠标事件
　　　　onclick单击、ondblclick双击、
　　　　onmousedown、鼠标按下onmouseup鼠标抬起、onmusemove鼠标移动、
　　　　onmouseover鼠标移入、onmuseout鼠标移出
　　B·键盘事件
　　　　onkeydown键盘按下、onkeyup键盘抬起onkeypress按住键盘（字符键）
　　C·表单事件
　　　　onsubmit按下提交、onblur失去焦点、onfocus获得焦点、onchange更改内容
　　D·页面事件
　　　　onload页面加载完成、onunload撤销载入、onbeforeunload页面刷新或关闭
三、事件绑定

　　1、DOM 0级事件绑定
　　2、DOM 2级事件绑定
　　　　IE：
　　　　添加：obj.attachEvent("on事件", "处理程序")；
　　　　删除：obj.dettachEvent("on事件", "处理程序");
　　　　****添加程序顺序与执行程序顺序相反，且无法删除匿名函数。
　　　　W3C：
　　　　添加：obj.addEventListener("事件", "处理程序");
　　　　删除：obj.removeEventListener("事件","处理程序");
　　解决兼容性问题：

add: function (type, e, foo) {
　　　　　　if (e.addEventListener) {
　　　　　　　　e.addEventListener(type, foo, false);
　　　　　　} else if (e.attachEvent) {
　　　　　　　　e.attachEvent(‘on‘ + type, foo, false);
　　　　　　} else {
　　　　　　　　e[‘on‘ + type] = foo;
　　　　　}
　　},
remove: function (type, e, foo) {
　　　　　　if (e.removeEventListener) {
　　　　　　　　e.removeEventListener(type, foo, false);
　　　　　　} else if (e.detachEvent) {
　　　　　　　　e.detachEvent(‘on‘ + type, foo);
　　　　　　} else {
　　　　　　　　e[‘on‘ + type] = null;
　　　　}
　　}
};

四、事件对象

　　1、事件源对象

　　　　IE：window.event
　　　　W3C：e
　　2、事件对象属性

　　鼠标事件:
　　　　1. 相对于浏览器位置
　　　　clientX 当鼠标事件发生的时候，鼠标相对于浏览器X轴的位置
　　　　clientY 当鼠标事件发生的时候，鼠标相对于浏览器Y轴的位置
　　　　2. 相对于屏幕位置
　　　　screenX 当鼠标事件发生的时候，鼠标相对于屏幕X轴的位置
　　　　screenY 当鼠标事件发生的时候，鼠标相对于屏幕y轴的位置
　　　　3. 相对于事件源位置
　　　　offsetX 当鼠标事件发生的时候，鼠标相对于事件源X轴的位置
　　　　offsetY 当鼠标事件发生的时候，鼠标相对于事件源y轴的位置
　　键盘事件:
　　　　keyCode: 获得键盘码
　　　　altKey: 判断alt键是否按下,返回true或false;
　　　　ctrlKey: 判断ctrl键是否按下,返回true或false;
　　　　shiftKey: 判断shift键是否按下,返回true或false;

　　常用键盘码:
　　　　enter: 13
　　　　shift: 16
　　　　ctrl: 17
　　　　alt: 18
　　　　空格: 32
　　　　左上右下: 37、38、39、40

五、事件流

　　1、分类

　　　　冒泡型：由明确的事件源到最不明确的事件源由内向外触发————false
　　　　捕获型：由不明确的事件源到到明确的事件源由外向内触发————true
　　　　****IE只支持冒泡型事件
　　2、阻止事件流

　　　　FF：stopPropagation();
　　　　IE：cancelBnbble()=true；
　　3、Event对象

　　　　W3C：obj.target (返回触发此事件的元素/事件的目标节点）
　　　　IE:srcElement （对于生成事件的window对象Document对象或Element对象的引用）

事件简单总结

标签：

原文地址：http://www.cnblogs.com/R46W8/p/4808800.html