欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

JS---DOM---为元素绑定事件和解绑事件的兼容代码

程序员文章站 2022-06-23 23:01:31
1. 绑定事件的兼容 function addEventListener(element,type,fn) { if(element.addEventListener){ element.addEventListener(type,fn,false); }else if(element.attach ......

1. 绑定事件的兼容

  function addeventlistener(element,type,fn) {
    if(element.addeventlistener){
      element.addeventlistener(type,fn,false);
    }else if(element.attachevent){
      element.attachevent("on"+type,fn);
    }else{
      element["on"+type]=fn;
    }
  }

 

2. 解绑事件的兼容

  function removeeventlistener(element,type,fnname) {
    if(element.removeeventlistener){
      element.removeeventlistener(type,fnname,false);
    }else if(element.detachevent){
      element.detachevent("on"+type,fnname);
    }else{
      element["on"+type]=null;
    }

 

测试解绑时间的兼容:

    //解绑事件的兼容
    //为任意的一个元素,解绑对应的事件
    function removeeventlistener(element, type, fnname) {
      if (element.removeeventlistener) {
        element.removeeventlistener(type, fnname, false);
      } else if (element.detachevent) {
        element.detachevent("on" + type, fnname);
      } else {
        element["on" + type] = null;
      }
    }

    function f1() {
      console.log("测试兼容第一个");
    }
    function f2() {
      console.log("测试兼容第二个");
    }

    addeventlistener(my$("btn1"), "click", f1);
    addeventlistener(my$("btn1"), "click", f2);
    my$("btn2").onclick = function () {
      removeeventlistener(my$("btn1"), "click", f1);
    };