在构建扩展的输入字段(复杂的日期选择器)时,我需要使用两个关键事件监听器。一个连接到输入字段,并启动界面。这很容易。
第二个附加到文档
,以关闭复杂的叠加层。单击覆盖层,它什么也不做。单击外部:覆盖层消失并且输入字段的值更新。
它还需要从文档
中删除事件监听器。
如果不是基于对象结构的话,这一切都会很简单。我不是在调用独立函数。我正在调用与该字段关联的数据对象的子函数(该字段无法引用回该函数)。
__DateField.prototype.activate = function () {
…
var t = this;
window.setTimeout(function () { document.addEventListener("click", function (ev) { t.closeDateSelector(ev) }, false); }, 0);
…
}
(我还没有弄清楚为什么该事件附件需要嵌套在 setTimeout
中,但如果我不这样做,它会立即调用自身。)
无论如何,问题是我无法成功调用 document.removeEventListener()
因为它不是相同的初始函数。
此外,我无法通过将函数作为独立附加来实现它,因为我需要对相关__DateField
对象的引用。
如何从文档
中删除该函数?
我查看了各种线程,它们说无法检查通过“addEventListener”添加的事件监听器,但想知道它们是否已经过时,因为 Firebug 可以列出它们......
最佳答案
要删除它,您必须拥有对该函数的引用,因此问题归结为:如何保留对该函数的引用?
最简单的答案是,因为您已经有一个方便的对象,所以是该对象的属性,如果您可以相信 this
在您执行删除时是正确的:
__DateField.prototype.activate = function () {
// …
var t = this;
window.setTimeout(function () {
t.listener = function (ev) {
t.closeDateSelector(ev)
};
document.addEventListener("click", listener, false);
}, 0);
// …
};
// To remove
__DateField.prototype.deactivate = function() {
if (this.listener != null) {
document.removeEventListener("click", this.listener, false);
this.listener = null;
}
};
或者,如果由于某种原因出现问题,您可以在作用域函数中使用变量:
(function() {
var listener = null;
__DateField.prototype.activate = function () {
// …
var t = this;
window.setTimeout(function () {
listener = function (ev) {
t.closeDateSelector(ev)
};
document.addEventListener("click", listener, false);
}, 0);
// …
};
// Later, when removing
function removeIt() {
if (listener != null) {
document.removeEventListener("click", listener, false);
listener = null;
}
}
})();
关于javascript - 删除子函数事件监听器,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29164368/