通过addEventListener监听函数实现的dom事件绑定

addEventListener可以为当前dom添加一个事件(这个事件可以是个已有的事件),这就无法避免我们在写代码的时候重复去绑定同一个事件,这时候该想到removeEventListener来取消事件绑定,但是有时候这个办法并不是那么好使,然后的内存释放就更加的不好做到。到头来还是运用ele.onclick=fn,ele.onclick=null,这种办法效果好。

在今天的项目中就遇到一个事件绑定的内存没有被释放掉最后造成了bug,使用addEventListener添加绑定事件,在我自己的代码环境中无法释放内存,当我再次给这个元素绑定一个和之前同样的事件的时候,这个触发器会同事触发两个或者多个事件,最后造成冲突。

事件绑定addEventListener的更多相关文章

  1. JS基础——事件绑定

    上一篇博客JS事件对象中,老师问JS事件处理和VB中的事件处理有什么联系?先来解决一下这个问题.举个VB.net中事件处理的样例(JS敲久了,VB习惯的都不熟悉了,看来得常常回想了): 1.事件处理V ...

  2. 兼容8事件绑定与解绑addEventListener、removeEventListener和ie的attachEvent、detachEvent

    兼容8事件绑定与解绑addEventListener.removeEventListener和ie的attachEvent.detachEvent   ;(function(){ // 事件绑定 bi ...

  3. attachEvent,addEventListener事件绑定

    兼容各主流浏览器的事件绑定(在同一个事件上添加多个处理函数). 1.绑定方法: //IE attachEvent(事件名, 函数) oBtn.attachEvent('onclick', aaa); ...

  4. 监听事件绑定(addEventListener、attachEvent)和移除(removeEventListener、detachEvent)

    /** * @description 事件绑定,兼容各浏览器 * @param target 事件触发对象 * @param type 事件 * @param func 事件处理函数 */ funct ...

  5. Vue - 事件绑定

    1.内联方式: A:将事件处理器绑定到一个方法中,以下所有事件都以click事件作为案例 注意:内联方式下事件处理器只能绑定一个方法,要是想要绑定多个方法,依旧还是使用js中的addEventList ...

  6. jQuery 2.0.3 源码分析 事件绑定 - bind/live/delegate/on

    事件(Event)是JavaScript应用跳动的心脏,通过使用JavaScript ,你可以监听特定事件的发生,并规定让某些事件发生以对这些事件做出响应 事件的基础就不重复讲解了,本来是定位源码分析 ...

  7. 深入学习jQuery事件绑定

    × 目录 [1]bind [2]trigger [3]delegate[4]on[5]one 前面的话 javascript有HTML.DOM0级.DOM2级和IE这四种事件处理程序,而jQuery对 ...

  8. js事件绑定及深入

    学习要点: 1.传统事件绑定的问题2.W3C事件处理函数3.IE事件处理函数4.事件对象的其他补充 事件绑定分为两种:一种是传统事件绑定(内联模型,脚本模型),一种是现代事件绑定(DOM2级模型).现 ...

  9. 原生JS事件绑定方法以及jQuery绑定事件方法bind、live、on、delegate的区别

    一.原生JS事件绑定方法: 1.通过HTML属性进行事件处理函数的绑定如: <a href="#" onclick="f()"> 2.通过JavaS ...

随机推荐

  1. tomcat 安装时出现 Failed to install Tomcat7 service

    今天在安装tomcat时提示 Failed to install Tomcat7 service了,花了大半天的时间找到了原因,下面分享给大家,希望对各位有所帮助. 应该是你卸载时直接删除目录导致的. ...

  2. 原生Ajax( XHR 和 Fetch )

    原生Ajax 基本使用的四大步骤,简单易懂 ajax(异步javascript xml) 能够刷新局部网页数据而不是重新加载整个网页.接下来通过本文给大家介绍Ajax的使用四大步骤,非常不错,感兴趣的 ...

  3. AutoCAD2016安装破解教程

    AutoCAD2016安装破解教程.本人亲自实验,破解成功,有效.以64位为例. 工具/原料   笔记本电脑 AutoCAD2016安装包 AutoCAD2016注册机(xf-adsk2016_x64 ...

  4. python 中的内置高级函数

    1.map(function,iterable) map是把迭代对象依次进行函数运算,并返回. 例子: map返回的十分map对象,需要list()函数转化. 2.exec()函数 执行储存在字符串或 ...

  5. Ubuntu下安装Samba服务器

    闲来无聊尝试自己安装下Samba服务器,使本机和虚拟机可以无障碍传输文件(虽然用VMwaretools可传,但总感觉麻烦,而且速度欠佳) 首先,同安装qemu一样,在安装之前要确定你的系统apt列表已 ...

  6. 关闭windows的DEP

    1.与开启dep时一样,按组合键win+r打开运行窗口,输入cmd并按回车,如图所示:    2.调出命令提示符窗口后,输入bcdedit.exe/set {current} nx AlwaysOff ...

  7. ArcGIS version not specified.

    问题 在调用arcgis10 的ISurface用来取指定航线的地形时,这段代码在加载.dem时总是出错. 报: Fail to open raster dataset 解决方法: 在窗体中加载Map ...

  8. System.getenv()和System.getProperty()

    System.getenv() 方法是获取指定的环境变量的值. System.getenv(String str) 接收参数为任意字符串,当存在指定环境变量时即返回环境变量的值,否则返回null. S ...

  9. 安卓apk反编译、修改、重新打包、签名全过程

    首先明确,反编译别人apk是一件不厚道的事情.代码是程序员辛苦工作的成果,想通过这种手段不劳而获,是不对的.这也说明,代码混淆是非常重要的.本文抱着学习的态度,研究在一些特殊的情况下如果有需要,该怎么 ...

  10. 洛谷 P3369 【模板】普通平衡树 (Treap)

    题目链接:P3369 [模板]普通平衡树 题意 构造一种数据结构满足给出的 6 种操作. 思路 平衡树 平衡树的模板题. 先学习了一下 Treap. Treap 在插入结点时给该结点随机生成一个额外的 ...