js点击获取验证码倒计时
余温
2017年12月28日 23时20分
web
<div class="mt10 inp-block flex-box"> <i class="ico-login2 block"></i> <input type="text" id="msgCode" class="flex-grow-1" placeholder="短信验证码" name="msgCode"> <input type="button" class="flex-grow-0 col6 getcode" value="点击发送验证码" onclick="sendCode(this)" style="line-height: 100%"/> <!-- <a href="javascript:;" class="flex-grow-0 col9">56s后重新获取</a>--> </div>
<script type="text/javascript"> //验证码倒计时 var clock = ''; var nums = 60;//刷新时间 var btn; function sendCode(thisBtn) { //这里写发送验证码的事件 if ($('#mobile').val() != '') { var tel=$('#mobile').val(); var account=$('#account').val(); if($('#mobile').val().length==11) { //如果手机号码不为空的时候才对点击按钮处理 btn = thisBtn; btn.disabled = true; //将按钮置为不可点击 btn.value = nums+'秒后可重新获取'; clock = setInterval(doLoop, 1000); //一秒执行一次 var data = {tel:tel,account:account}; $.ajax({ type: 'post', dataType: 'json', data:data, url: '/index.php/Mobile/Recruit/findsendmsg', error: function(){showtip('发送失败!',3);}, success: function(r) { console.log(r); if(r.status==1){ showtip("验证码已发送到您手机,请注意查看",3); }else{ showtip(r.info,3); } } }); }else { showtip("手机号码错误",3); }; }else { showtip("缺少手机号码,请完善资料后再操作",3); }; } function doLoop() { nums--; if(nums > 0){ btn.value = nums+'秒后可重新获取'; }else{ clearInterval(clock); //清除js定时器 btn.disabled = false; btn.value = '点击发送验证码'; nums = 60; //重置时间 } } </script>
上一篇:
mysql 查询重复数据
下一篇:
php 一些方法
请登陆后评论
{{vo.time}} 回复