如果javascript禁止重复触发点击事件，导致重复API请求

nzk0hqpo 于 2023-01-16 发布在 Java

关注(0)|答案(1)|浏览(128)

我是一个前端新手，用户需要点击按钮才能获得积分，点击按钮的时候会触发一个API，但是我担心用户点击太快会反复向后端发送API请求，目前我的知识只知道可以像示例中那样写，请问有没有更好或者更安全的方法？谢谢

let btn = document.querySelector("#btn");

btn.addEventListener('click', function(e) {
  console.log("Receive point")
  btn.setAttribute('disabled', true)
})

<button id="btn">Receive points</button>

JavaScript

来源：https://stackoverflow.com/questions/75116347/if-repeated-triggering-of-click-events-is-prohibited-through-javascript-resulti

1条答案

按热度按时间

2g32fytz1#

您可以在第一次单击后使用removeEventListener而不是disable按钮属性删除事件侦听器。
示例：

window.addEventListener("load", () => {
  document.getElementById("btn").addEventListener("click", removeclick);
});

function removeclick() {
  console.log("Clicked 1 time . No new event fired.");
  document.getElementById("btn").removeEventListener("click", removeclick);
}

<button id="btn">Receive points</button>

或者使用addEventListener的第三个参数once:true，这允许事件侦听器只运行一次。
示例：
一个二个一个一个

赞(0）回复(0）举报 2023-01-16

我来回答

如果javascript禁止重复触发点击事件，导致重复API请求

1条答案

相关问题

热门标签

最新问答