<div class="div user-input">
<input type="number" class="code" name="verify" placeholder="请输入手机验证码" required maxlength="6">
<input type="button" class="obtain generate_code" value=" 获取验证码">
</div>
<script >
// 倒计时
var countdown=60;
var obj = $(".generate_code");
function settime() {
if (countdown == 0) {
obj.attr("disabled",false);
obj.val("免费获取验证码");
obj.css('background',"#E84A4B");
countdown = 60;
return;
} else {
obj.attr("disabled", true);
obj.val("重新发送(" + countdown + ")");
obj.css('background',"#ccc");
countdown--;
}
setTimeout(function() {
settime(obj) },1000)
}
//点击获取验证码
$('.generate_code').click(function(){
var phone = document.getElementById('phone').value;
var disabled = $(".codeBtn").attr("disabled");
if(disabled){
return false;
}
if(phone == ""){
alert('请先输入手机号');
return false;
}else if(!(/^1[34578]\d{9}$/.test(phone))){
alert('手机号码有误,请重新输入');
return false;
}
else{
settime();
$.ajax({
type: "GET",
url: "",
data: {},
dataType: "json",
success:function(data){
},
error:function(err){
}
});
}
</script>
验证码的倒计时
最后编辑于 :
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。
推荐阅读更多精彩内容
- 缘由 对于做这个封装的目的就是想制造一个简单易用无风险的验证码倒计时控件吧 便于在多个项目使用,网络上也有很多类似...
- Android_验证码按钮倒计时 - 简书 http://www.jianshu.com/p/a953ae1c76c3
- 不知道从啥时候开始兴起了一股风潮~~大学生一毕业都不找工作了!勤恳工作的大好青年都辞职了!现在都必须得创业!!你要...