发布一个事件管理模块
在BeyondSoft期间写了一个关于事件对象的分析报告，期间不断的总结。业余时间练习写了事件管理的各个版本(E0.0.1~E0.3.1)。目的希望根本工作需要选择不同的版本，因为有些库的事件模块很强大但却用不上。灵感来自JQuery , Dean Edwards , 灵图api 。当然还有与群里 猪婶婶 的讨论。
/**
* Event v0.3.1
* 1, 解决IE fn中丢失this
* 2, 统一了事件对象作为fn的第一个参数
* 3, 解决事件对象的兼容性问题，如阻止默认行为，停止冒泡等（支持DOM2/3 events）
* 4, remove方法新增删除元素type类型的所有监听器(参数传el，type)
* 5, remvoe方法新增删除元素所有的监听器(参数传el)
* 6, 解决了同一个事件的handlers执行顺序问题(IE无序，FF/Safari/Chrome中顺序)
* 8, add方法新增once参数，fn只执行一次
* 9, 增加对非html元素(普通对象)自定义事件---观察者模式
* 10,增加dispatch方法
*/
以下列出的是完整版E0.3.1的使用
1，最简单的添加、删除监听函数的事件
function handle(){
//todo
}
E.add(document,'click',handle);
E.remove(document,'click',handle);
2，为同一个元素添加多个handle时，执行有序。如下先弹出1，再2
function handle1(){
alert(1);
}
function handle2(){
alert(2);
}
E.add(document,'click',handle1);
E.add(document,'click',handle2);
3，handle只执行一次
function handle(){
alert(1);
}
E.add(document,'click',handle,true);
4，删除元素指定类型的所有监听器
function handle1(){
alert(1);
}
function handle2(){
alert(2);
}
E.add(document,'click',handle1);
E.add(document,'click',handle2);
E.remove(document,'click');
5，删除附加元素上的所有监听器
function handle1(){
alert(1);
}
function handle2(){
alert(2);
}
E.add(document,'click',handle1);
E.add(document,'mouseover',handle2);
E.remove(document);
6，主动触发事件。如模拟用户点击
function handle(){
alert(1);
}
E.add(document,'click',handle);
E.dispatch(document,'click');
7，如有必要，可给html元素添加自定义事件，使用dipatch触发
function handle(){
alert('myevent');
}
E.add(document,'myevent',handle);
E.dispatch(document,'myevent');
8，给任意对象添加自定义事件
function handle(){
alert('fish is swimming.');
}
var fish = {};
E.add(fish,'swimming',handle);
E.dispatch(fish,'swimming');
我整理的事件对象属性列表：
http://docs.google.com/View?id=dr9sm67_277d5g7wgdn
源码见附件