js解绑事件

最新推荐文章于 2022-02-26 10:40:57 发布
原创 最新推荐文章于 2022-02-26 10:40:57 发布 · 698 阅读 · 1 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文介绍了三种常见的事件绑定方法及其对应的解绑方式：使用对象.on、addEventListener和attachEvent进行事件绑定，并提供了每种方法的解绑示例。 
/*
注意注意注意！！：一定是用了什么方法绑定事件，就用对应的方式解绑事件
1，第一种方式
对象.on事件类型=function();
=====解绑方式
对象.on事件类型=null;

2,第二种方式
对象.addEventListener("事件类型",命名函数，false);
=====解绑方式
 对象.removeEventListener("事件类型",命名函数，false);


3，第三种方式
对象.attachEvent("on事件类型",命名函数);
=====解绑方式
 对象.detachEvent("on事件类型",命名函数);

 */
Frostbite2
关注
【JS笔记】JS常见的事件、事件传播、事件解绑、事件委托、阻止事件冒泡、阻止默认行为、正则表达式
✅ Java 开发工程师，从事 Web 应用程序的研发，擅长 Spring、SpringBoot 等技术。 ✅ 热爱编程，业余时间学习新知识，通过 优快云 记录学习心得和笔记内容。
05-05 784
JS中的事件是由三部分组成的，分别是：事件源、事件类型、事件处理函数。事件源是指：谁触发了事件；事件类型是指：触发了什么事件；事件处理函数是指：触发事件之后，应该做什么事情。
JavaScript事件监听(事件类型、事件对象、事件解绑)、this环境对象、改变this指向
Bulut0907
05-20 867
L0旧版事件解绑：直接使用null覆盖就可以。点击按钮不会出现弹窗。L2新版事件解绑：使用。
js 解绑事件
Beware beginning
08-26 353
解绑事件 1. xx.onClick = null 2. 需要在绑定事件的时候 使用命名函数 xx.removeEventListener("click",function(){ } ,false); xx.detachEvent("onclick",f1); 3.解绑事件
JavaScript元素事件的绑定与解绑
流楚丶格念的博客
08-21 4363
为元素绑定事件(DOM):一种,但是不兼容,有两种 1 对象.addEventListener(“事件类型”,事件处理函数,false);–谷歌和火狐支持,IE8不支持 2 对象.attachEvent(“有on的事件类型”,事件处理函数)–谷歌不支持,火狐不支持,IE8支持 为按钮绑定点击事件 参数1:事件的类型—事件的名字,没有on 参数2:事件处理函数—函数(命名函数,匿名函数) 参数3:布尔类型,目前就写false-----没有为什么,不解释,明天说 参数1:事件类型—事件名字，有on 参数2:事件
js事件解绑
qq_41998938的博客
07-24 487
1.解绑事件的使用方法： 2.具体应用 代码如下： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> ...
解绑事件
Charlie8915的博客
01-24 254
注意：用什么方式绑定事件，就用什么方式解绑事件 1.解绑事件 对象.on事件名字=时间处理函数---》绑定事件 对象。on事件名字=null; 2.解绑事件 对象.addEventListener("没有on的事件类型"，命名函数，false)；--绑定事件 对象.removeEventListener("没有on的事件类型"，命名函数，false)；--解绑事件 3.解绑...
jQuery移除元素自动解绑事件实现思路及代码
10-25
在jQuery中，移除元素并自动解绑事件是优化网页性能的重要步骤，因为未解绑的事件会继续占用内存，导致资源浪费。本文主要探讨如何使用jQuery的`remove()`、`html()`和`empty()`方法来移除元素，并在移除前确保事件...
jquery事件绑定解绑机制源码解析
10-21
当需要解绑事件时，`off`方法会被调用。如果未指定回调函数，`off`方法会从元素缓存中取出对应事件类型的整个处理函数队列，并逐一解除绑定。如果指定了回调函数，则只解绑该特定的事件处理函数。 在`on`方法中，还...
JS中事件的绑定和解绑
qq_48937489的博客
12-04 2292
JS中事件的绑定和解绑、dem0级事件（'on数据类型'）、dem2级事件(事件源.addEventListener('事件类型', 事件处理函数)、、事件源.removeEventListener('事件类型', 事件处理函数)、事件源.attachEvent('on事件类型', 事件处理函数)、事件源.detachEvent('on事件类型', 事件处理函数)) 复杂数据类型的比较
js之解绑事件
seimeii的博客
11-22 504
一、直接删除法 二、 先有绑定函数，再次解除法
JS——注册事件及解绑事件
weixin_52148548的博客
02-13 1576
这里写目录标题概念1. 传统方式（on~）注册事件解绑事件2. 事件监听注册方式 addEventListener()注册事件解绑事件3.两种方式的区别传统方式事件监听注册方式 概念 给元素添加事件，称为注册事件或绑定事件。 给元素移除事件，称为解绑事件。 1. 传统方式（on~） 注册事件 以on开头的事件： onclick（鼠标单击），onmousemove（鼠标移动）等等 语法： target.onclick=function(){}; 举例：给button注册事件，使按下打印数字1 <but
js事件解绑的两种方式
dong_dong222的博客
02-26 819
传统解绑方式 非传统解绑方式
解除绑定事件
weixin_43608739的博客
05-16 253
用什么方式绑定事件，就用对应的方式解绑事件 一、 对象.on事件名字 = 事件处理函数;---->绑定事件 对象.on事件名字 = null;　　　　　　----->解绑 <input type="button" value="绑定" id="btn"> <input type="button" value="解除绑定" id="btn2"> my$("btn...
事件解绑
qq_34550459的博客
05-14 295
移除事件方法: off(events,[selector],[fn]) 不带参数:移除元素上绑定的所有事件 Demo: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv=
JavaScript-事件解绑
coder-itl
11-29 127
css div { color: #fff; width: 200px; height: 200px; font-size: 20px; font-weight: 700; text-align: center; background-color: purple; html结构 <div>我是.
JS解除事件绑定
陈广晗
03-12 2061
很简单的都在代码里面了直接上代码吧 &lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;meta charset="utf-8" /&gt; &lt;title&gt;&lt;/title&gt; &lt;script src="JavaScript.js"&gt;&lt
js中的解绑事件
weixin_34112900的博客
07-24 101
//解绑事件: /* * 注意:用什么方式绑定事件,就应该用对应的方式解绑事件 * 1.解绑事件 * 对象.on事件名字=事件处理函数--->绑定事件 * 对象.on事件名字=null; * 2.解绑事件 * 对象.addEventListener("没有on的事件类型",命名函数,false);---绑定事件 * 对象.removeEventListener("没有on的事...
JS-DOM— —删除事件(解绑事件)
mocoll的博客
08-19 434
二、删除事件（解绑事件） 2.1、删除事件方式 1.传统注册方式 eventTarget.onclick = null; 2.方法监听注册方式 eventTarget.removeEventListener(type, listener[, useCapture]); eventTarget.detachEvent(eventNameWithon, callback) ; 例： ...
元素解绑事件
hugejihu9的专栏
12-26 332
文章来自：源码在线https://www.shengli.me/javascript/497.html        
jquery解绑事件
最新发布
07-30
在 jQuery 中，可以通过多种方式解绑元素上绑定的事件监听器，以避免内存泄漏、提升性能或防止不必要的事件触发。以下是几种常用的方法： ### 1. 使用 `off()` 方法解绑事件 `off()` 是 jQuery 中推荐用于解绑事件的方法，它可以移除通过 `on()` 绑定的事件监听器。其基本语法如下： ```javascript $(selector).off('eventName', handlerFunction); ``` - `eventName` 是要解绑的事件名称，如 `click`、`mouseover` 等。 - `handlerFunction` 是可选参数，指定要移除的具体事件处理函数。如果不提供该参数，则会移除该事件的所有监听器。 例如，解绑某个 `div` 上的 `click` 事件： ```javascript $('div').off('click'); ``` 如果之前是通过 `on()` 添加了特定处理函数，可以指定函数名来移除： ```javascript function handleClick() { console.log('Clicked!'); } $('div').on('click', handleClick); $('div').off('click', handleClick); ``` ### 2. 使用 `unbind()` 方法（已不推荐） `unbind()` 是 jQuery 早期版本中用于解绑事件的方法，在 jQuery 1.7 之后被 `off()` 取代。其基本用法如下： ```javascript $(selector).unbind('eventName', handlerFunction); ``` 虽然 `unbind()` 仍可在较新版本中使用，但官方推荐使用 `off()` 以保持一致性与兼容性。 ### 3. 使用命名空间解绑特定事件 jQuery 支持为事件绑定命名空间，这样可以在解绑时更精确地控制要移除的事件监听器。例如： ```javascript $('div').on('click.myNamespace', function() { console.log('Clicked with namespace!'); }); // 解绑带有命名空间的事件 $('div').off('click.myNamespace'); ``` 这种方式在处理多个插件或模块绑定的事件时非常有用。 ### 4. 解绑所有事件 如果希望移除某个元素上的所有事件监听器，可以直接调用不带参数的 `off()`： ```javascript $(selector).off(); ``` 这将移除该元素上绑定的所有事件监听器。 ### 5. 事件委托的解绑 当使用事件委托（将事件绑定到父元素）时，`off()` 同样适用。只需确保选择器与最初绑定时一致： ```javascript $('#parent').on('click', 'button', function() { console.log('Button clicked!'); }); // 解绑委托事件 $('#parent').off('click', 'button'); ``` ### 注意事项 - 在解绑事件时，确保选择器与绑定时一致，否则可能无法正确移除监听器。 - 使用命名空间或指定处理函数可以更精确地控制解绑行为，避免误删其他监听器。 ---
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值