时间:2021-05-26
在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的
下面我写了一个兼容了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);
下面我写了一个兼容性的方法给大家参考,实现也是很简单
function remove(str,ele,fn){ ele.detachEvent?ele.detachEvent("on"+str,fn):ele.removeEventListener(str,fn); }注意点:不管是绑定事件attachEvent还是删除事件detachEvent都是要加on的,removeEventListenser和addEventListenser则不需要加on
以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持
声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。
事件绑定分为两种:一种是传统事件绑定(内联模型,脚本模型),一种是现代事件绑定(DOM2级模型)。现代事件绑定在传统绑定上提供了更强大更方便的功能。一传统事件绑
绑定其实就是把一些常规时间绑定到页面,然后进行各种常规操作解绑就是接触绑定,绑定的事件失效要注意,iQuery中的.事件如(.click())其实就是单个的绑定
本文实例讲述了js事件机制----捕获与冒泡机制。分享给大家供大家参考,具体如下:先从事件绑定机制说起,事件绑定机制通过绑定方法addEventListener
js事件绑定事件绑定,这里使用了冒泡的原理,从点击的元素开始,递归方式的向父元素传播事件,这样做的好处是对于大量要处理的元素,不必为每个元素都绑定事件,只需要在
其所谓的动态添加事件实质就是指js中的事件委托。我们知道在js中,事件处理只能绑定在当前被选中的元素上,换句话也就是说,事件处理只能绑定在当前文档已经存在的元素