JavaScript实现跨浏览器的添加及删除事件绑定函数实例
作者：黑咖啡
这篇文章主要介绍了JavaScript实现跨浏览器的添加及删除事件绑定函数,采用纯javascript实现jquery的bind及unbind添加与删除事件绑定的技巧,具有很好的浏览器兼容性,需要的朋友可以参考下
本文实例讲述了JavaScript实现跨浏览器的添加及删除事件绑定函数。分享给大家供大家参考。具体如下：
IE 的事件绑定函数是 attachEvent；而 Firefox, Safari 是 addEventListener；Opera 则两种都支持。使用jQuery就可以使用简单的bind()，或者$().click()之类的函数解决，而如果不使用JavaScript框架的时候，大家可是使用下面的封装bind()函数。
添加事件绑定 bind()
/************************************
* 添加事件绑定
* @param obj : 要绑定事件的元素
* @param type : 事件名称。不加 "on". 如 : "click" 而不是 "onclick".
* @param fn : 事件处理函数
************************************/
function bind( obj, type, fn ){
if( obj.attachEvent){
obj['e'+type+fn]= fn;
obj[type+fn]=function(){
obj['e'+type+fn]( window.event);
}
obj.attachEvent('on'+type, obj[type+fn]);
}else
obj.addEventListener( type, fn,false);
}
例如给document添加一个点击事件：
var fn=function(){
alert("Hello, World!!");
};
bind(document,"click", fn);
删除事件绑定 unbind()
unbind()对于上面的bind()函数
/************************************
* 删除事件绑定
* @param obj : 要删除事件的元素
* @param type : 事件名称。不加 "on". 如 : "click" 而不是 "onclick"
* @param fn : 事件处理函数
************************************/
function unbind( obj, type, fn ){
if( obj.detachEvent){
obj.detachEvent('on'+type, obj[type+fn]);
obj[type+fn]=null;
}else
obj.removeEventListener( type, fn,false);
}
例如删除第一个绑定的document点击事件：
复制代码 代码如下:
unbind(document,"click",fn);
希望本文所述对大家的javascript程序设计有所帮助。