使用递归实现获取短信验证码的按钮时间显示倒计时功能,代码十分简洁易懂。
具体demo实现:
<html>
<head>
<meta charset="utf-8">
<title></title>
<script src="jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function () {
$("#sendMess").click(function(){
$("#sendMess").attr("disabled", "");
countDown(5);
})
});
function countDown(s){
if(s <= 0){
$("#sendMess").val("重新获取");
$("#sendMess").removeAttr("disabled");
return;
}
$("#sendMess").val(s + "秒后重新获取");
setTimeout("countDown("+(s-1)+")",1000);
}
</script>
</head>
<body>
<label>手机号码:</label>
<input id="mobile" type="text" value="" />
<input id="sendMess" type="button" value="发送验证码" /></p>
</body>
</html>