[英]Only fire an event once?
如何控制只触发一次事件?
实际上,快速的 Google 似乎暗示了.one
有帮助的事实。
如果您不需要支持 Internet Explorer,请使用once
:
element.addEventListener(event, func, { once: true });
否则使用这个:
function addEventListenerOnce(target, type, listener, addOptions, removeOptions) {
target.addEventListener(type, function fn(event) {
target.removeEventListener(type, fn, removeOptions);
listener.apply(this, arguments);
}, addOptions);
}
addEventListenerOnce(document.getElementById("myelement"), "click", function (event) {
alert("You'll only see this once!");
});
与 rofrol 的回答相同,只是另一种形式:
function addEventListenerOnce(element, event, fn) {
var func = function () {
element.removeEventListener(event, func);
fn();
};
element.addEventListener(event, func);
}
rofrol 的 anwser 的稍微改进版本:
function addEventListenerOnce(target, type, listener) {
target.addEventListener(type, function fn() {
target.removeEventListener(type, fn);
listener.apply(this, arguments);
});
}
通过使用 apply 传递所有参数,并且this
按预期工作。
只需在 addEventListener 方法调用中使用适当的选项:
element.addEventListener(event, func, { once: true })
此外,您可以这样做:
window.addEventListener("click", function handleClick(e) {
window.removeEventListener("click", handleClick);
// ...
});
添加了添加/删除事件侦听器的选项:
function addEventListenerOnce(target, type, listener, optionsOrUseCaptureForAdd, optionsOrUseCaptureForRemove) {
const f = event => {
target.removeEventListener(type, f, optionsOrUseCaptureForRemove);
listener(event);
}
target.addEventListener(type, f, optionsOrUseCaptureForAdd);
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.