自定义事件
原本的事件处理的原理：事件是javascript与浏览器交互的主要途径。
事件是一种叫做观察者的设计模式
观察者模式由两类对象组成：主体和观察者。
主体用于发布事件；
观察者通过订阅这些事件来观察该主体。
自定义事件的原理：
将事件处理程序保存在一个数组中；
当添加事件的时候，我们push进去这个事件处理函数；
当我们执行的时候，从头遍历这个数组中的每个事件处理函数，并执行。
自定义事件应该具有的内容：
1.一个handler对象，对象中保存着存放事件处理函数的数组
handler = {
‘click’ : [func1,func2],
‘my’ : [func3,func4]
}
2.一个addhandler函数，用于添加事件处理函数
3.一个removehandler函数，用于删除事件处理函数
4.一个fire函数，用于执行所添加的函数。
注：使用原型模式来创建自定义事件对象。
代码如下：
1 function EventTarget(){
2 /*
3 * handlers:用来存储时间处理程序
4 */
5 this.handlers = {};
6 }
7 EventTarget.prototype = {
8 constructor : EventTarget,
9 /*
10 * addHandler:用于注册给定类型事件的事件处理程序
11 * type:自定义的事件类型，任意字符串
12 * handler：自定义的事件处理函数
13 */
14 addHandler : function( type,handler ){
15 if( typeof this.handlers[type] == "undefined" ){
16 this.handlers[type] = [];
17 }
18 this.handlers[type].push( handler );
19 },
20 /*
21 * fire:用于触发一个事件
22 * event:是一个事件对象，可以自定义它拥有的属性
23 */
24 fire : function( event ){
25 if( !event.target ){
26 event.target = this;
27 }
28 if( this.handlers[event.type] instanceof Array){
29 var handlers = this.handlers[event.type];
30 for( var i=0,len=handlers.length;i<len;i++ ){
31 handlers[i]( event );
32 }
33 }
34 },
35 /*
36 * removeHandler:用于注销某个事件类型的事件处理程序
37 */
38 removeHandler : function( type,handler ){
39 if( this.handlers[type] instanceof Array ){
40 var handlers = this.handlers[type];
41 for( var i=0,len=handlers.length;i<len;i++ ){
42 if( handlers[i] == handler){
43 break;
44 }
45 }
46 handlers.splice( i,1 );
47 }
48 }
49 }
扩展：(详细参见http://www.zhangxinxu.com/wordpress/?p=2330）
DOM自定义事件：如为某个元素添加一个自定义的事件。
基本格式如下：
var $ = function(el) {
return new _$(el);
};
var _$ = function(el) {
this.el = el;
};
_$.prototype = {
constructor: this,
addEvent: function() { // ...},
fireEvent: function() { // ... },
removeEvent: function() { // ... }
}
于是我们就可以使用类似$(dom).addEvent()的语法为元素添加事件
重点：fireEvent()方法
1.对于标准浏览器
eve = document.createEvent( ‘HTMLEvents’ )：返回新创建的event对象
eve.initEvent( eventType,canBubble ,preventDefault )：初始化对象
element.dispatchEvent( eve )：在元素上触发事件
（注：关于creatEvent()更多说明参考：http://blog.csdn.net/jxst051665/article/details/3931598
2.对于IE浏览器
"propertychange"事件，就是属性改变即触发的事件
代码地址：https://github.com/xiaoxiaojing/practiseCode/blob/master/advancedSkills/custom_event.js
参考文章：http://www.zhangxinxu.com/wordpress/?p=2330
参考书籍：《js高级程序设计》