标签：
自定义事件：主要是跟函数有关系,就是让函数能够具备事件的某些特性。自定义事件不能向事件那样绑定后，就可以触发，是需要主动触发即对自定义事件函数进行调用。
一般需要两个函数，一个是绑定自定义事件的函数，另外一个是触发自定义事件的函数。
<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>无标题文档</title> <script> window.onload = function(){ var oDiv = document.getElementById(‘div1‘); var oSpan = document.getElementById(‘span1‘); bindEvent(oDiv , ‘click‘,function(){ alert(1); }); bindEvent(oDiv , ‘click‘,function(){ alert(2); }); bindEvent(oSpan , ‘show‘,function(){ alert(3); }); bindEvent(oSpan , ‘show‘,function(){ alert(4); }); bindEvent(oSpan , ‘hide‘,function(){ alert(5); }); fireEvent(oSpan , ‘show‘); //3 , 4 }; //绑定自定义事件, 储存在对象的listeners属性下的events属性(数组) function bindEvent(obj,events,fn){ //obj : 楼层 //events : 书架 //fn : 一本书 obj.listeners = obj.listeners || {}; obj.listeners[events] = obj.listeners[events] || []; obj.listeners[events].push( fn ); if(obj.addEventListener){ obj.addEventListener(events,fn,false); } else{ obj.attachEvent(‘on‘+events,fn); } } //主动触发自定义事件, 遍历执行对象的listeners属性下的events属性存储的所有函数 function fireEvent(obj,events){ for(var i=0;i<obj.listeners[events].length;i++){ obj.listeners[events][i](); } } </script> </head> <body> <div id="div1">div</div> <span id="span1">span</span> </body> </html>
标签：
原文地址：http://www.cnblogs.com/yuzhenghua/p/4892788.html
