原生js之事件解绑
#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之事件解绑的更多相关文章
- JS里关于事件的常被考察的知识点:事件流、事件广播、原生JS实现事件代理
1.JS里面的事件流 DOM2级事件模型中规定了事件流的三个阶段:捕获阶段.目标阶段.冒泡阶段,低版本IE(IE8及以下版本)不支持捕获阶段 捕获事件流:Netscape提出的事件流,即事件由页面元素 ...
- 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对象) ...
- JQuery的事件委托;jQuery注册事件;jQuery事件解绑
一.事件 ①事件委托:就是给子元素的父元素或者祖先元素注册一个事件,但是事件的执行者是子元素,委托事件的好处是能够给动态创建出来时元素也加上事件. ②简单事件:就是给自己注册事件自己执行动态创建出来的 ...
- js绑定事件和解绑事件
在js中绑定多个事件用到的是两个方法:attachEvent和addEventListener,但是这两个方法又存在差异性 attachEvent方法 只支持IE678,不兼容其他浏览器 addEv ...
- 点击事件解绑unbind
$(".choose").unbind("click").click(function(){} 这个类先解绑了点击事件再添加个点击事件有事如果不这样你点击第二次 ...
- 原生JS添加事件方法
事件 事件添加方式 EvenTarget.addEventListener(EvenName, functionName, option); EventName: example => clic ...
- (二)原生JS实现 - 事件类方法
事件处理 - 添加事件 var addEventHandler = function (oTarget, sEventType, fnHandler) { if (oTarget.addEventLi ...
- jquery绑定事件,解绑事件
unbind([type],[data]) 是 bind()的反向操作,从每一个匹配的元素中删除绑定的事件.如果没有参数,则删除所有绑定的事件.你可以将你用bind()注册的自定义事件取消绑定.如果提 ...
- JS添加事件和解绑事件:addEventListener()与removeEventListener()
作用: addEventListener()与removeEventListener()用于处理指定和删除事件处理程序操作. 它们都接受3个参数:事件名.事件处理的函数和布尔值. 布尔值参数是true ...
随机推荐
- tcp输入数据 慢速路径处理 && oob数据 接收 && 数据接收 tcp_data_queue
大致的处理过程 TCP的接收流程:在tcp_v4_do_rcv中的相关处理(网卡收到报文触发)中,会首先通过tcp_check_urg设置tcp_sock的urg_data为TCP_URG_NOTYE ...
- open系统调用
/* int open(const char *pathname, int flags, mode_t mode);flag:打开方式,可以man 2 open查看 O_RDONLY O_WRO ...
- Python_爬虫_Scrapy设置代理
0.检测IP是否可用 # -*- coding: UTF-8 -*- from urllib import request if __name__ == "__main__": # ...
- Single Depth peeling 顺序无关渲染(OIT)
什么是顺序无关渲染 在3D渲染中,物体的渲染是按一定的顺序渲染的,这也就可能导致半透明的物体先于不透明的物体渲染,结果就是可能出现半透明物体后的物体由于深度遮挡而没有渲染出来.对于这种情况通常会先渲染 ...
- pikachs 渗透测试1-环境及暴力破解
一.安装 PhpStudy20180211,默认安装 1.mysql默认密码是root,因为在虚拟机,保留不动 2.解压pikachs 到 C:\phpStudy\PHPTutorial\WWW\pi ...
- 重闯Sqli-labs关卡第二天(5关)
第五关(双注入GET单引号字符型注入-报错时间注入) 盲注盲注,Blind SQL Injection基于布尔SQL盲注基于时间的SQL盲注基于报错的SQL盲注 核心代码:(不会返回数据库中的数据) ...
- Redis 用的很溜,了解过它用的什么协议吗?
我是风筝,公众号「古时的风筝」,一个兼具深度与广度的程序员鼓励师,一个本打算写诗却写起了代码的田园码农! 文章会收录在 JavaNewBee 中,更有 Java 后端知识图谱,从小白到大牛要走的路都在 ...
- 实用简易的U盘修复工具推荐
如果我们的U盘出现可以读取,但不能打开,或是提示格式化的情况,那可能是U盘硬件出现了问题.U盘内部部件损坏就只能维修了,如果是u盘出现逻辑错误,常用的解决方法就是到网上下载一个u盘修复工具,对u盘进行 ...
- appium元素定位总结
appium元素定位方法总结 使用uiautomator定位 driver.find_element_by_android_uiautomator(uia_string) 根据resourceId属性 ...
- 红外遥控接收发射原理及ESP8266实现
红外遥控是利用近红外光进行数据传输的一种控制方式.近红外光波长0.76um~1.5um ,红外遥控收发器件波长一般为 0.8um~0.94um ,具有传输效率高,成本低,电路实现简单,抗干扰强等特点, ...