您的位置：首页 > Web前端 > JavaScript

js实现60秒内不能重复点击按钮

2018-01-21 15:30 211 查看

在网页中经常看到一个发送验证码的按钮，点击之后变成60s递减一直到了0秒后又变成文字发送验证码。并且才能继续点击。这个利用到了 js当中的定时器。我这里就改成了5s后才能再次点击。其道理是一样的。

代码如下：

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<button id="btn_send">发送验证码</button>
</body>
<script src="jquery-1.9.1.min.js"></script>
<script>
var time = 5;
$("#btn_send").on('click',function () {
$(this).attr("disabled",true);
alert("234");
var timer = setInterval(function () {
if(time == 0){
$("#btn_send").removeAttr("disabled");
$("#btn_send").html("重新发送");
clearInterval(timer);
}else {
$("#btn_send").html(time);
time--;
}
},1000);
});
</script>
</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签： js计时器

相关文章推荐

新的分享

章节导航