jquery点击执行倒计时后才能再次点击
jquery点击执行倒计时后才能再次点击,可用于验证码限制点击过快等。代码截图:
应用案例:
代码如下:<!doctype html>
<html lang="zh-cn">
<head>
<meta charset="utf-8">
<title>jquery点击执行倒计时后才能再次点击</title>
</head>
<body>
<img src="psb.jpg" width="300px" id="btn">
<input type="button" id="btn2" value="获取" />
<script src="http://libs.baidu.com/jquery/1.8.3/jquery.min.js"></script>
<script>
$(function () {
$('#btn').on('click',function KeyRefresh(){
var count=3,countdown=setInterval(Refresh,1000);
$('#btn').off('click');//点击就移除ID绑定
function Refresh(){
$("#btn2").val(count + " 秒后重新获取");//显示倒计时用
if (count == 0){
$('#btn').on('click',KeyRefresh);//判断倒计时为0 重新绑定ID
$("#btn2").val("获取");//重新绑定后按钮
clearInterval(countdown);
}
count--;
}
});
});
</script>
</body>
</html>
更多用途请自行发挥拓展。
页:
[1]