#removeEventListener
##html

    <button id='btn'>click</button>

##js
###第一种方式(错误方式)

    var btn = document.getElementById("btn");
//绑定事件
btn.addEventListener('click', function () {
console.log('click btn')
})
//解除绑定,调试发现不可用
btn.removeEventListener('click', function () {
console.log('remove')
})

###第二种方式(正确方式)

    var btn = document.getElementById("btn");
function btnHandler() {
console.log('click btn')
}
//绑定事件
btn.addEventListener('click', btnHandler)
//解除绑定(可以成功,第一种不成功是因为回调是两个不同的函数,指向了不同的内存,第二种把回调定义到外面,两次的回调是同一个函数)
btn.removeEventListener('click', btnHandler)

原生js之事件解绑的更多相关文章

  1. JS里关于事件的常被考察的知识点:事件流、事件广播、原生JS实现事件代理

    1.JS里面的事件流 DOM2级事件模型中规定了事件流的三个阶段:捕获阶段.目标阶段.冒泡阶段,低版本IE(IE8及以下版本)不支持捕获阶段 捕获事件流:Netscape提出的事件流,即事件由页面元素 ...

  2. jQuery - 03. each、prevaAll、nextAll、获取属性、修改属性attr/val/text()、jq.height/width、offset()./position()./scrol Left/Top 、事件绑定bind、delegate、on、事件解绑、事件对象、多库共存

    each 方法 $ ( selector).each(function( index,element) {  } );   参数一表示当前元素在所有匹配元素中的索引号 参数二表示当前元素(DOM对象) ...

  3. JQuery的事件委托;jQuery注册事件;jQuery事件解绑

    一.事件 ①事件委托:就是给子元素的父元素或者祖先元素注册一个事件,但是事件的执行者是子元素,委托事件的好处是能够给动态创建出来时元素也加上事件. ②简单事件:就是给自己注册事件自己执行动态创建出来的 ...

  4. js绑定事件和解绑事件

    在js中绑定多个事件用到的是两个方法:attachEvent和addEventListener,但是这两个方法又存在差异性 attachEvent方法  只支持IE678,不兼容其他浏览器 addEv ...

  5. 点击事件解绑unbind

    $(".choose").unbind("click").click(function(){} 这个类先解绑了点击事件再添加个点击事件有事如果不这样你点击第二次 ...

  6. 原生JS添加事件方法

    事件 事件添加方式 EvenTarget.addEventListener(EvenName, functionName, option); EventName: example => clic ...

  7. (二)原生JS实现 - 事件类方法

    事件处理 - 添加事件 var addEventHandler = function (oTarget, sEventType, fnHandler) { if (oTarget.addEventLi ...

  8. jquery绑定事件,解绑事件

    unbind([type],[data]) 是 bind()的反向操作,从每一个匹配的元素中删除绑定的事件.如果没有参数,则删除所有绑定的事件.你可以将你用bind()注册的自定义事件取消绑定.如果提 ...

  9. JS添加事件和解绑事件:addEventListener()与removeEventListener()

    作用: addEventListener()与removeEventListener()用于处理指定和删除事件处理程序操作. 它们都接受3个参数:事件名.事件处理的函数和布尔值. 布尔值参数是true ...

随机推荐

  1. X-Height

    术语x-height是指给定字体中,任何给定尺寸下小写字母x的高度. 它提供了一种描述任意字体一般比例的方法. 在印刷中,x-height是一行文字的基线与小写字母(即不包括上升笔画或下降笔画)的主体 ...

  2. read/write系统调用

    /*拷贝文件内容实例read系统调用.write系统调用ssize_t read(int fd, void *buf, size_t count);ssize_t write(int fd, cons ...

  3. linux基本操作之linux登陆

    一 文本登陆方式: 输入用户名与密码:/etc/passwd文件对照(口令文件,保存基本的用户信息):/etc/shadow文件对照(影子文件,保存密码信息):启动相应的shell程序:用户得到 一个 ...

  4. 磁盘构造/msdos分区(fdisk)格式化(mkfs)和挂载

    分区不是必要的,分区是与系统盘分开,防止数据丢失. 磁盘使用流程:查看磁盘(fdisk -l)---分区---格式化(创建文件系统)----挂载(自动挂载) 分区表类型:msdos(一般是系统分区)  ...

  5. C#委托的详细总结

    1.什么是委托 委托是C#中一种类型,它的作用相当于C语言中的函数指针,它定义了方法的类型,使得可以将方法当作另一个方法的参数来进行传递,这种将方法动态地赋给参数的做法,可以避免在程序中大量使用if- ...

  6. 万字长文!从底层开始带你了解并发编程,彻底帮你搞懂java锁!

    线程是否要锁住同步资源 锁住 悲观锁 不锁住 乐观锁 锁住同步资源失败 线程是否要阻塞 阻塞 不阻塞自旋锁,适应性自旋锁 多个线程竞争同步资源的流程细节有没有区别 不锁住资源,多个线程只有一个能修改资 ...

  7. 如何灵活运用ABBYY FineReader的识别功能

    由于工作的原因,经常会使用到文字识别工具,说真的,一款好用的文字识别工具能省不少事,前不久碰到一位职场新人,他的工作内容也离不开文字识别工具,他还问我有什么好用的软件推荐,说到好用,还是ABBYY F ...

  8. day007|python基础回顾7

    文件处理 目录 文件处理 1 文件打开模式补充 2.1 文件操作之读操作 2.2 文件操作之写操作 3 控制文件指针移动 3.1 前提 3.2 f.seek() 4 文件修改的两种方式 4.1 方式一 ...

  9. 在iOS中使用ZBar扫描二维码和条形码

    最近做了个外包项目,里面用到了二维码扫描和微信支付!之前比较熟悉的是ZXing,但是在Xcode7.1里面发现竟然莫名的不支持,木有办法,从网上查了一下还有一种支持二维码扫描的东西,没错就是接下来我要 ...

  10. 编程语言输出“ Hello World ”,你真的都会了吗?

    Hello World 中文意思是『你好,世界』.因为<The C Programming Language>中使用它做为第一个演示程序,非常著名,所以后来的程序员在学习编程或进行设备调试 ...