javascript - 怎么才能正确移除绑定事件??
本文介绍了javascript - 怎么才能正确移除绑定事件??的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
问 题
解决方案
const something = {
bindEvent() {
// 不管是用 function 或箭头函数封装还是 bind(this),
// 都会产生新的函数,需要把这个新函数保存起来,这里用 this.events 来保存,
// 方便以后移除绑定事件
this.events = {
mouseenter: e => this.mouseenterHandler(e),
mouseleave: this.mouseleaveHandler.bind(this),
click: this.clickHandler
};
// Array.from 可以把伪数组变成真正的数组,
// 当然原来的 [].forEach.call 也没有什么问题
// 不过 dot => { ... } 是箭头函数,不需要定义 self 来保存 this
Array.from(document.querySelectorAll(".dot"))
.forEach(dot => {
// 这里是三句 addEventListener,
// 直接用 Object.keys(this.events).forEach 简写了
Object.keys(this.events)
.forEach(key => dot.addEventListener(key, this.events[key]));
});
},
unbindEvent() {
// 万一没调 bindEvent,this.events 会是 undefined,所以这里处理一下。
// 其它的和 bindEvent 中的代码差不多,就不逐一解释了
const events = this.events || {};
Array.from(document.querySelectorAll(".dot"))
.forEach(dot => {
Object.keys(events)
.forEach(key => dot.removeEventListener(key, events[key]));
});
}
};
这篇关于javascript - 怎么才能正确移除绑定事件??的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文