js實現60秒內不能重複點選按鈕
阿新 • • 發佈:2019-02-05
在網頁中經常看到一個傳送驗證碼的按鈕,點選之後變成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>