wdmsyf 发表于 2013-1-24 06:46:02

JavaScript事件绑定方法

简单实用版:                                                                                        
function bind(elm, evType, fn, useCapture) { if (elm.addEventListener) {elm.addEventListener(evType, fn, useCapture);//DOM2.0return true; }else if (elm.attachEvent) {var r = elm.attachEvent('on' + evType, fn);//IE5+return r; }else {elm['on' + evType] = fn;//DOM 0 }} 
Dean Edwards版:                                                                                                   
功能非常强悍,解决IE的this指向问题,event总是作为第一个参数传入,跨浏览器就更不在话下。
function bind(element, type, handler) { //为每一个事件处理函数分派一个唯一的ID if (!handler.$$guid) handler.$$guid = addEvent.guid++; //为元素的事件类型创建一个哈希表 if (!element.events) element.events = {}; //为每一个"元素/事件"对创建一个事件处理程序的哈希表 var handlers = element.events; if (!handlers) {handlers = element.events = {};//存储存在的事件处理函数(如果有)if (element["on" + type]) {   handlers = element["on" + type];} } //将事件处理函数存入哈希表 handlers = handler; //指派一个全局的事件处理函数来做所有的工作 element["on" + type] = handleEvent;};//用来创建唯一的ID的计数器addEvent.guid = 1;function removeEvent(element, type, handler) { //从哈希表中删除事件处理函数 if (element.events && element.events) {delete element.events; }};function handleEvent(event) { var returnValue = true; //抓获事件对象(IE使用全局事件对象) event = event || fixEvent(window.event); //取得事件处理函数的哈希表的引用 var handlers = this.events; //执行每一个处理函数 for (var i in handlers) {this.$$handleEvent = handlers;if (this.$$handleEvent(event) === false) {   returnValue = false;} } return returnValue;};//为IE的事件对象添加一些“缺失的”函数function fixEvent(event) { //添加标准的W3C方法 event.preventDefault = fixEvent.preventDefault; event.stopPropagation = fixEvent.stopPropagation; return event;};fixEvent.preventDefault = function() { this.returnValue = false;};fixEvent.stopPropagation = function() { this.cancelBubble = true;}; 
HTML5版:                                                                                                 
var addEvent=(function(){ if(document.addEventListener){return function(el,type,fn){   if(el.length){    for(var i=0;i<el.length;i++){   addEvent(el,type,fn);    }   }else{    el.addEventListener(type,fn,false);   }}; }else{return function(el,type,fn){   if(el.length){    for(var i=0;i<el.length;i++){   addEvent(el,type,fn);    }   }else{    el.attachEvent(‘on‘+type,function(){   return fn.call(el,window.event);    });   }}; }})(); 
页: [1]
查看完整版本: JavaScript事件绑定方法