js中的点击函数堆叠

Question

我的 js 代码需要一些帮助...

我目前正在尝试创建一些键盘快捷键，以使我的工作更快一点，我编写了这段代码，每次加载网站时都使用 violent Monkey 运行。

var reloadButton = document.getElementById("btnSearchAll");
document.addEventListener('keydown', (event) => {
    if(event.altKey && event.key == "r") {
    reloadButton.click();
  }
});

问题是，每次我使用此快捷方式时，我尝试单击的按钮的 click 功能都会堆积起来。我第一次使用它时，它会点击一次，第二次它会触发两次，依此类推。

我尝试使用 if 语句在其中添加一些逻辑，并在我放开按键时添加事件侦听器，但它似乎不起作用。

我不太擅长 javascript，所以我请求你的帮助。问题似乎是什么？

Answer 1

我们可能需要更多上下文，因为您的代码应该正常工作。也许它会以某种方式重新运行。

var reloadButton = document.getElementById("btnSearchAll");
document.addEventListener("keydown", (event) => {
  if (event.altKey && event.key === "r") {
    reloadButton.click();
  }
});

<button id="btnSearchAll" onclick="console.log('clicked');">btnSearchAll</button>

但是您可以尝试下面的代码片段，首先检查事件是否已附加：

var reloadButton = document.getElementById("btnSearchAll");
var attached = false;

if (!attached) {
  attached = true;
  document.addEventListener("keydown", (event) => {
    if (event.altKey && event.key === "r") {
      reloadButton.click();
    }
  });
}

<button id="btnSearchAll" onclick="console.log('clicked');">btnSearchAll</button>