ajax接收手机验证码,倒计时60秒,并进行验证判断
register.html:
<input type="text" placeholder="请输入手机号" class="inp" name="uphone" id="uphone" style="width: 50%;">
<input type="button" name="but" id="dianji" class="inp" style="background-color:#ED5564;width: 50%;margin-left: 2rem;" value="发送验证码" >
<input type="text" placeholder="手机验证码" class="inp" name="yzm" id='yzm' >
<input type="hidden" id="cookie" name="cookie" value="">
<input type="submit" id="sub" onclick="return fun()" value="注册" class="btn-l mt5" style="border: none;"></div>
<script>
//==============================手机验证码(开始)=============================
$("#dianji").click(
function(){
var phone = $("#uphone").val();
var reg = /^((1[3,5,8][0-9])|(14[5,7])|(17[0,6,7,8])|(19[7]))\d{8}$/;
if((!reg.test(phone))){
alert('请确认手机号码');
}else{
$.get("接受验证码的域名文件(如:www.baidu.com/send.php)",{ph:phone},function(data)
{
$("#cookie").val(sum); //把获得的验证码放到隐藏控件
})
}
}
);
var wait=60;
function time(o) {
if (wait == 0) {
o.removeAttribute("disabled");
o.value="发送验证码";
wait = 60;
} else {
o.setAttribute("disabled", true);
o.value="重新发送(" + wait + ")";
wait--;
setTimeout(function() {
time(o)
},
1000)
}
}
document.getElementById("dianji").onclick=function(){time(this);}
//=================================手机验证码(结束)===================================
</script>
index.php:
public function register()
{
if(request()->isPost())
{
$cookie=input('cookie'); //接受系统实际的验证码
$yzm=input('yzm'); //接受用户输入的验证码
//判断两个验证码是否一致
if($cookie!=$yzm)
{
$this->error('对不起,验证码不正确');
}
}
}