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. C#6.0语言规范(三) 基本概念

    应用程序启动 具有入口点的程序集称为应用程序.运行应用程序时,会创建一个新的应用程序域.应用程序的几个不同实例可以同时存在于同一台机器上,并且每个实例都有自己的应用程序域. 应用程序域通过充当应用程序 ...

  2. sublime text下安装插件autoprefixer

    有时候在写css样式的时候,分不清哪些属性需要前缀,哪些不需要,总是爱搞混淆了,于是autoprefixer这款插件便应运而生了.虽然在使用webpack的时候,我们可以很方便的使用这个,但是,如果项 ...

  3. 国外青少年最喜爱的聊天 app,竟然是 Google Docs

    简评: 这还真不是标题党,Google Docs 的协作中内置了实时聊天的功能,也可以进行 comments,颇有种现代「传纸条」的既视感.其实国内的石墨文档.腾讯文档等协作工具也有类似的效果,本文很 ...

  4. Spring Boot国际化开发实战

    本章将讲解如何在Spring Boot和Thymeleaf中做页面模板国际化的支持,根据系统语言环境或者session中的语言来自动读取不同环境中的文字. 国际化自动配置 Spring Boot中已经 ...

  5. 使用pyenv来管理python版本

    使用pyenv可以很方便的切换python版本,而不会影响系统的python版本,对需要使用supervisor(仅支持python2)托管程序,项目使用python3开发的情况十分有用 pyenv的 ...

  6. jfixed使固定行列可编辑表格

    功能: 固定行列 可以在表格直接编辑 使用ajax对数据操作 使用tab键在可编辑列切换简单介绍一下jfixed 表格插件, jfixed /jfixed.rar

  7. [视频]K8飞刀 HackerIE自动检测网站注入教程

    [视频]K8飞刀 HackerIE自动检测网站注入教程 https://pan.baidu.com/s/1c08rihi

  8. NFS客户端挂载

    关于NFS挂载#卸载: umount -fl /挂载名称#重新挂载:mount -t nfs -o rw,noac 10.8.16.11:/vx/SJOA-APP /挂载名称 #mount –v查看当 ...

  9. CSS 将一个页面平均分成四个部分(div)

    在项目中遇到需求,数据监控页面需要同时显示4个板块内容,如下图: CSS 如何将一个页面平均分成四个部分(div)呢? <!DOCTYPE html> <html lang=&quo ...

  10. 服务器运维 -- windows系统更换System32下文件后 重启无法进入桌面

    场景描述: windows系统更换System32下文件后 重启无法进入桌面 情况1,原替换文件有备份     解决建议: 准备好该文件 情况2,原备份文件没有备份  解决建议:从相同版本的服务器上边 ...