<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>倒计时</title>
<style>
.sendCheck{
padding: 4px;
border-radius: 4px;
display: inline-block;
font-size: 13px;
cursor: pointer;
letter-spacing: 1px;
border: 1px solid #f6f6f6;
background-color: transparent;
}
</style>
</head>
<body>
<input type="button" class="sendCheck" value="发送验证码">
<script src="js/jquery-1.4.4.min.js"></script>
<script>
var time = 5;
$(".sendCheck").bind({
click:function(e){var stop = setInterval(function(){if(time>0){$(".sendCheck").val("重新发送("+time+")");time--;$(".sendCheck").attr("disabled","true").css({"cursor": "not-allowed"})}else{window.clearInterval(stop);$(".sendCheck").val("发送验证码");time=5;$(".sendCheck").removeAttr("disabled").css({"cursor": "pointer"})}console.log(time);},1000);
}
})
</script>
</body>
</html>
说明:time:是倒计时的最大时间,可自由更改。当点击按钮后,按钮开始禁用,并倒数,当time小于0就清除掉定时器,并恢复按钮点击事件。