前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >js中绑定事件与解除绑定事件的3种方式

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

作者头像
用户4344670
发布2019-08-28 10:54:39
18.7K1
发布2019-08-28 10:54:39
举报
文章被收录于专栏:vue的实战vue的实战
方式一:
代码语言: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);
本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
原始发表:2018.09.22 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 方式一:
  • 方式二:谷歌 火狐支持 ie8不支持
  • 方式三:ie8支持 谷歌 火狐不支持
  • 兼容性代码:
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档