如何在Javascript中将按钮点击次数限制为每分钟一次

我有一个基于PHP的web应用程序，它监视进程的状态并显示具有该状态的页面。用户可以单击页面上的按钮来更新状态。但是，我的服务器上的处理负载很重，因此不希望过于频繁地更新状态。因此，我想要一种方法来限制某人每分钟点击一次Submit按钮（刷新页面上显示的状态）。例如，如果有人在12:00:00单击按钮，他们应该在12:01:00之前不能再次单击该按钮

点击按钮后，我可能想禁用按钮，并在一分钟后重新启用它-这是我首选的解决方案

---

非常感谢。

使用setTimeout。

只是一个建议，但是如果您要通过编写代码来使用客户端计时器（setTimeout）限制提交按钮的速率，为什么不一起删除更新按钮，并在预定义的时间间隔内自动更新页面

以下是jQuery中的一些示例代码（因为jQuery提供了一些非常好的跨浏览器AJAX支持）

$（函数（）{
//页面加载时。。。
更新状态（）；
})
函数updateStatus（）{
$（'#status'）.load（'/url/to/status/display.php'）；
setTimeout（updateStatus，60000）//60000毫秒=1分钟
}

要实现这一纯javascript，您只需捕获点击事件，禁用按钮并在超时后再次启用它，下面的代码使用jQuery并假设您的按钮具有id“button”（点击！或者如果它是输入：点击！）

$（“#按钮”）。单击（函数（）{
$（this.attr（'disabled'，'disabled'）；
设置超时（启用按钮，1000）；
返回true；//确保发生默认的单击事件
});
var enableButton=函数（）{
$（“#按钮”）.removeAttr（'disabled'）；
}

你说这个过程相当繁重，请注意，即使人们不能每分钟按一次按钮（如果他们启用了javascript），他们仍然可以禁用javascript并按任意多的按钮，或者直接调用url任意多次

---

编辑将完整HTML添加到脚本中

wtf。。。人们对jQuery上瘾

<input id="btn" type="button" value="click me" onclick="doSomething();"/>

<script>
function doSomething() {
  document.getElementById("btn").disabled=true;
  setTimeout('document.getElementById("btn").disabled=false;',60000);
  // do your heavy stuff here
}
</script>

函数doSomething（）{
document.getElementById（“btn”）.disabled=true；
setTimeout（'document.getElementById（“btn”）.disabled=false；'60000）；
//把你的重东西放在这里
}

使用underline.js这非常简单：

var func = _.debounce(function(x) {return x * x}, 60000);

---

Hai T.Stone，谢谢你的回答，换句话说，在我按下提交按钮后，该按钮必须变为禁用，超过1分钟后，它再次变为启用。如果您不介意使用纯javascript…：D非常感谢T.Stone..Hai Pim J，谢谢你的回答，我已经试过你的剧本了，但是你能给我完整的剧本吗？在此之前，非常感谢Pim J.+1指出JavaScript被禁用的后果。@Pedro这是因为我们中的许多人都被浪费时间试图让最简单的脚本在浏览器间运行所折磨，我们再也不想处理它了。jQuery并不完美，但它（以及所有类似的框架）提供了一个抽象层，允许开发人员关注他们正在做什么，而不是浏览器X的特殊怪癖。但是问题中没有jQuery标记。如果人们学习一点简单的javascript，那么SO中90%的jQuery问题都不会出现在Pedro中。回答得好！简单。

<input id="btn" type="button" value="click me" onclick="doSomething();"/>

<script>
function doSomething() {
  document.getElementById("btn").disabled=true;
  setTimeout('document.getElementById("btn").disabled=false;',60000);
  // do your heavy stuff here
}
</script>

var func = _.debounce(function(x) {return x * x}, 60000);