html DOM元素有很多on开头的监听事件,如onload、onclick等,见DOM事件列表。但是同一种事件,后面注册的会覆盖前面的:

window.onresize = function(){
alert(1);
}
window.onresize = function(){
alert(2);
}
// 改变窗口大小时,只会弹出2

addEventListener监听

  利用addEventListener添加监听事件,可以重复添加,并不会互相覆盖:

window.addEventListener("resize",function(){
alert(1)
})
window.addEventListener("resize",function(){
alert(2)
})
// 改变窗口大小时,先后弹出1和2

  注意这里面的事件是不带"on"前缀的。

removeEventListener移除监听

  removeEventListener跟addEventListener相对应,用于移除事件监听。

  如果要移除事件句柄,addEventListener() 的执行函数必须使用外部具名函数,匿名函数事件是无法移除的。

// 匿名函数事件无法移除
window.addEventListener("resize",function(){
alert(1)
}) // 监听具名函数事件
function myResize(){
alert(2)
}
window.addEventListener("resize",myResize)
// 移除事件监听
window.removeEventListener("resize",myResize)

  

js 监听事件的叠加和移除的更多相关文章

  1. js监听事件的绑定与移除

    监听事件的绑定与移除主要是addEventListener和removeEventListener的运用. addEventListener语法 element.addEventListener(ty ...

  2. js监听事件

    //// 监听事件 监听使用各种浏览器 // var p1 = document.getElementById("p1"); //// 监听事件 // eventUtil.addE ...

  3. js监听事件 上滑消失下滑出现的效果 触摸与手势事件

    https://www.w3cmm.com/javascript/touch.html //触摸与手势事件连接tinyscrollbar //方法1var _this = $('#fabu');var ...

  4. JS监听事件错误:Uncaught TypeError: xx(函数名)is not a function at HTMLInputElement.onclick

    事件监听一直出错,提示已定义的函数名不是一个函数,折腾了好久才想到,原来是函数名和JS内部关键字重名造成的. 以前也遇到过这种情况,但因为发生的概率比较小,就没太在意,但是这次感觉这方面确实需要注意, ...

  5. egret之移除带参数的监听事件

    this.selectBtn.addEventListener(egret.TouchEvent.TOUCH_TAP, this.onClickNewIndo.bind(this,this.data) ...

  6. JAVAscript学习笔记 js句柄监听事件 第四节 (原创) 参考js使用表

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  7. ActiveX(二)Js 监听 ActiveX中的事件

    在上一篇随笔:ActiveX(一)第一个简单的Demo 中,已经可以实现 js 单向调用 ActiveX 中的方法,在很多情况下ActiveX中的方法的执行时相对耗时.耗性能的.在这样的情况下.Act ...

  8. js 监听整个页面的回车事件

    JS监听整个页面的回车事件 <script type="text/javascript"> document.onkeydown=keyDownSearch;      ...

  9. 原 JS监听回车事件

    原 JS监听回车事件 发表于2年前(2014-06-04 10:16)   阅读(6101) | 评论(0) 11人收藏此文章, 我要收藏 赞0 1月16日厦门 OSC 源创会火热报名中,奖品多多哦  ...

随机推荐

  1. LabVIEW(十六):多列列表框控件

    1.多列列表框控件:前面板右键>列表.表格和树>多列列表框2.默认情况下只显示列首,可设置显示行首:前面板选中多列列表框右键>显示>行首3.LabVIEW中提供42种自带的图标 ...

  2. Shell-6--预定义变量

  3. D3.js的一些基础部分 (v3版本)

    最近公司有需求要做一些可视化的功能.之前一直都是用Echarts做的,但是Echarts难以满足我们的需求,经过多方请教,查找发现D3可以满足我们的需求.第一次接触到D3,发现这些图标的可交互性非常丰 ...

  4. Java 11 快要来了,编译 & 运行一个命令搞定!

    Java 11 马上要来了,原定于 9 月发布,还有不到 3 个月了,敬请期待更多新功能被加入到 11 当中,本文本讲的是 JEP 330 这个新特性. 化繁为简,一个命令编译运行源代码 看下面的代码 ...

  5. 09-部署配置kubedns插件

    安装和配置 kubedns 插件 官方的yaml文件在:kubernetes/cluster/addons/dns. 该插件直接使用kubernetes部署,官方的配置文件中包含以下镜像: gcr.i ...

  6. springboot + mybatis

    这两天启动了一个新项目因为项目组成员一直都使用的是mybatis,虽然个人比较喜欢jpa这种极简的模式,但是为了项目保持统一性技术选型还是定了 mybatis.到网上找了一下关于spring boot ...

  7. mysql 开发进阶篇系列 27 数据库字符集设置

    在安装完数据库后,使用汉字插入到表中,会报错,需要修改字符集类型,如下图所示: -- 插入汉字时报错 INSERT INTO User2 VALUES('张三') -- 查看字符集 SHOW VARI ...

  8. 六:理解控件的运行机制(例:基于WebControl命名空间的控件)

    Control类的Render方法在WebControl类中被被分成三部分1:RenderBeginTag,呈现标签的开始2:RenderContents,呈现标签的内容3:RenderEndTag, ...

  9. quartz配置参数org.quartz.jobStore.misfireThreshold含义解释

    配置定时任务参数 quartz.properties文件时 需要配置jobStore的超过时间数 默认为60秒(这里单位为毫秒) org.quartz.jobStore.misfireThreshol ...

  10. leetcode — swap-nodes-in-pairs

    /** * Source : https://oj.leetcode.com/problems/swap-nodes-in-pairs/ * * Created by lverpeng on 2017 ...