js中绑定事件与解除绑定事件的3种方式

2019-08-28 10:54:39 浏览数 (1)

方式一:
代码语言:javascript复制
 btn.onclick = function (){
        console.log("123");
    };
    btn.onclick = function (){
        console.log("345");//只能打印这一个结果
    };
代码语言:javascript复制
解除:
btn.onclick = null;
方式二:谷歌 火狐支持 ie8不支持
代码语言:javascript复制
 btn.addEventListener("click",function(){
        console.log("123");
    },false);
    btn.addEventListener("click",function(){
        console.log("456");
    },false);
结果:123 456

解除:

代码语言:javascript复制
btn.removeEventLinter("click",f1,false);
方式三:ie8支持 谷歌 火狐不支持
代码语言:javascript复制
btn.attachEvent("onclick",function(){
        console.log("123");
    });
    btn.attachEvent("onclick",function(){
        console.log("456");
    });
结果:123 456

解除:

代码语言:javascript复制
btn.detachEvent("onclick",f1);
兼容性代码:
代码语言:javascript复制
function  fn (element){
       if(btn.addEventListener){
           btn.addEventListener("click",fa);
       }else {
           btn.attachEvent("onclick",fa);
       }
   };
   function fa (){
       console.log("123");
   }
   fn(btn);

0 人点赞