js绑定事件和解绑事件

网络编程 2021-07-04 18:32www.168986.cn编程入门

本篇文章主要介绍了js绑定事件和解绑事件的相关知识。具有很好的参考价值。狼蚁网站SEO优化跟着长沙网络推广一起来看下吧

在js中绑定多个事件用到的是两个方法:attachEvent和addEventListener,这两个方法又存在差异性

attachEvent方法只支持IE678,不兼容其他浏览器

addEventListener方法兼容火狐谷歌,不兼容IE8及以下

addEventListener方法

div.addEventListener('click',fn);

div.addEventListener('click',fn2);
function fn(){ console.log("春雨绵绵"); }

function fn2(){
        console.log("到处潮湿");
      }

attachEvent方法

div.attachEvent('onclick',fn);
div.attachEvent('onclick',fn2);
function fn(){ console.log("春雨绵绵"); }
function fn2(){
        console.log("到处潮湿");
      }

注意点:attachEvent方法绑定的事件是带on的,addEventListener绑定的事件是不带on的

狼蚁网站SEO优化我写了一个兼容了IE和火狐谷歌的方法

var div=document.getElementsByTagName("div")[0];
      addEvent('click',div,fn)
      function addEvent(str,ele,fn){
        ele.attachEvent?ele.attachEvent('on'+str,fn):ele.addEventListener(str,fn);
      }
      function fn(){
        console.log("春雨绵绵");
      }

这样就完美的解决了兼容性的问题

有绑定事件的话,那就肯定有解绑事件,解绑事件和绑定事件一样,万恶的IE还是会搞特殊化

detachEvent方法只支持IE678,不兼容其他浏览器

removeEventListener方法兼容火狐谷歌,不兼容IE8及以下

detachEvent方法写法:

ele.detachEvent("onclick",fn);

removeEventListener的写法:

ele.removeEventListener("click",fn);

狼蚁网站SEO优化我写了一个兼容性的方法给大家参考,实现也是很简单

function remove(str,ele,fn){
        ele.detachEvent?ele.detachEvent("on"+str,fn):ele.removeEventListener(str,fn);
      }

注意点:不管是绑定事件attachEvent还是删除事件detachEvent都是要加on的,removeEventListenser和addEventListenser则不需要加on

以上就是本文的全部内容，希望本文的内容对大家的学习或者工作能带来一定的帮助，也希望多多支持狼蚁SEO

上一篇：使用jQuery,Angular实现登录界面验证码详解下一篇：详解ECMAScript6入门--Class对象

js绑定事件和解绑事件

狼蚁网络搜索

狼蚁网络导航

长沙seo优化

长沙网络营销

长沙网站建设

js绑定事件和解绑事件

编程语言

狼蚁网络搜索

狼蚁网络导航

长沙seo优化

长沙网络营销

长沙网站建设