JavaScript实现跨浏览器的添加及删除事件绑定函数实例

前端技术 2023/09/09 JavaScript

本文实例讲述了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程序设计有所帮助。

本文地址：https://www.stayed.cn/item/24627

转载请注明出处。

本站部分内容来源于网络,如侵犯到您的权益,请 联系我

我的博客

人生若只如初见，何事秋风悲画扇。

我的标签

随笔档案