验证码 cookie倒计时

最新推荐文章于 2020-07-30 18:11:14 发布

吃素的小动物

最新推荐文章于 2020-07-30 18:11:14 发布

阅读量122

点赞数

文章标签： ui php javascript ViewUI

原文链接：http://www.cnblogs.com/shao-ss/p/7809523.html

版权

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title></title>
<meta name="description" content="Angularjs, Html5, Music, Landing, 4 in 1 ui kits package" />
<meta name="keywords" content="AngularJS, angular, bootstrap, admin, dashboard, panel, app, charts, components,flat, responsive, layout, kit, ui, route, web, app, widgets" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />

<div style=" background:#666;width:100%;height:50px;color:#fff;font-size:24px;line-height: 50px;padding-left: 20px">CCAUTOMAX</div>
<div class="app app-header-fixed " id="gai" style="margin: 0;padding: 0; background:#fff; width:100%;height:800px; " >
<div class="col-sm-6" style="width:700px;margin:0px 300px; padding-top:30px;height:100%">
<div class="panel panel-default">
<div class="panel-heading font-bold" style="font-size:18px">密码修改</div>
<div class="panel-body">
<form class="bs-example form-horizontal" action="forget.php" name="mainform" method="post">

<input type="hidden" name="methods" id="methods" value="">
<input type="hidden" name="staff_brand_id" id="staff_brand_id" value="<{$brandid}>">

<div class="form-group">
<label class="col-lg-3 control-label">员工电话<span style="color:red">*</span></label>
<div class="col-lg-7">
<input type="text" class="form-control" id="staff_phone" name="staff_phone" value="<{$arr.staff_phone}>" placeholder="请输入手机号码" style="width:70%; float:left;ime-mode: disabled;" required="required">
<span class="btn w-xs btn-default" style="display:block; width:28%;float:right"><a href="javascript:void(0);" οnclick="javascript:sendValidAjax();" id="valid_html">发送验证码</a></span>

</div>
</div>
<{if $systemMsg.staff_phone neq ''}>
<div class="form-group">
<label class="col-lg-3 control-label"></label><div class="col-lg-7" style="color:red;"> <{$systemMsg.staff_phone}></div>
</div>
<{/if}>

<div class="form-group">
<label class="col-lg-3 control-label">验证码<span style="color:red">*</span></label>
<div class="col-lg-7">
<input type="text" placeholder="验证码" class="form-control" autocomplete="off" name="validnumber" id="validnumber" style="width:70%; float:left;ime-mode: disabled;" value="" required="required">

</div>
</div>

<{if $systemMsg.validnumber!=''}>
<div class="form-group">
<label class="col-lg-3 control-label"></label><div class="col-lg-7" style="color:red;"> <{$systemMsg.validnumber}></div>
</div>
<{/if}>

<div class="form-group">
<label class="col-lg-3 control-label">新密码<span style="color:red">*</span></label>
<div class="col-lg-7">
<input type="password" class="form-control" required="required" name="staff_passwd" value="" placeholder="请输入密码">
</div>
</div>
<div class="form-group">
<label class="col-lg-3 control-label"></label>
<div class="col-lg-7" >
<span style=" float:left;color:#777;font-size:12px;"> 密码为6~16位，且必须由大写字母、小写字母、数字组成</span>
</div>
</div>
<{if $systemMsg.staff_passwd neq ''}>
<div class="form-group">
<label class="col-lg-3 control-label"></label><div class="col-lg-7" style="color:red;"> <{$systemMsg.staff_passwd}></div>
</div>
<{/if}>
<div class="form-group">
<label class="col-lg-3 control-label">确认密码<span style="color:red">*</span></label>
<div class="col-lg-7">
<input type="password" class="form-control" required="required" name="staff_passwd_ag" value="" placeholder="请确认密码">
</div>
</div>
<{if $systemMsg.staff_passwd_ag neq ''}>
<div class="form-group">
<label class="col-lg-3 control-label"></label><div class="col-lg-7" style="color:red;"> <{$systemMsg.staff_passwd_ag}></div>
</div>
<{/if}>

<div class="form-group">
<div class="col-lg-offset-3 col-lg-7">
<input type="button" οnclick="preser()" class="btn btn-sm btn-info" value="提交" />
<a class="btn w-xs btn-default" href="http://automax.junhang-sh.com/login.php" style=" width:50px; height:31px;font-size:12px">返回</a>
</div>
</div>

</form>
</div>
</div>
</div>

</div>

<span style="float:left;margin-left:30px;">© 2017 Copyright.</span>
</div>

//开始倒计时
var countdown;
var valid_send_flag=true;
function settime(obj) {
//var obj=document.getElementById("valid_html");
countdown=getCookieValue("secondsremained");
if (countdown == 0) {

obj.innerHTML="发送验证码";
valid_send_flag=true;
return;
} else {
if(countdown==undefined){
obj.innerHTML="发送验证码";
valid_send_flag=true;
return;
}
obj.innerHTML=countdown + "s后再发送";
countdown--;
editCookie("secondsremained",countdown,countdown+1);
}

setTimeout(function() { settime(obj) },1000) //每1000毫秒执行一次
}

/**
*cookie
* */
///发送验证码时添加cookie
function addCookie(name,value,expiresHours){
//判断是否设置过期时间,0代表关闭浏览器时失效
if(expiresHours>0){
var date=new Date();
date.setTime(date.getTime()+expiresHours*1000);
$.cookie(name, escape(value), {expires: date});
}else{
$.cookie(name, escape(value));
}
}
//修改cookie的值
function editCookie(name,value,expiresHours){
if(expiresHours>0){
var date=new Date();
date.setTime(date.getTime()+expiresHours*1000); //单位是毫秒
$.cookie(name, escape(value), {expires: date});
} else{
$.cookie(name, escape(value));
}
}
//根据名字获取cookie的值
function getCookieValue(name){
return $.cookie(name);
}
/**
* 校验手机
*/
function checkPhone() {
var errorFlag = true;
var errorMessage = "";
var value = $("#staff_phone").val();
if(value.length>0){

var myReg = /^(((13[0-9]{1})|(14[5-9]{1})|(15[0-9]{1})|(17[0-9]{1})|(18[0-9]{1}))+\d{8})$/;
if (!myReg.test(value)) {
errorFlag = false;
errorMessage = "手机格式不正确";
}

}else{
errorFlag = false;
errorMessage = "手机格式不正确";
}
if(!errorFlag){

alert(errorMessage);
}
return errorFlag;
}
function checkValidNumber() {
var errorFlag = true;
var errorMessage = "";
var value = $("#validnumber").val();
if (!$.isEmptyObject(value)) {

var myReg = /^\d*$/;
if (!myReg.test(value)) {
errorFlag = false;
errorMessage = "验证码不正确";
}

}else{
errorFlag = false;
errorMessage = "验证码不正确";
}
if(!errorFlag){
alert(errorMessage);
}
return errorFlag;
}

function sendValidAjax()
{

if(!valid_send_flag)return;
if(!checkPhone()) return;
valid_send_flag=false;

v = getCookieValue("secondsremained");//获取cookie值
if(v>0){
settime(document.getElementById("valid_html"));//开始倒计时
}else{
$.post('forget.php',{methods:"sendvalid",phone:$("#staff_phone").val()}, function(data){
var data=JSON.parse(data);

if(data!=''){

if(data == 1)
{
valid_send_flag=false;
addCookie("secondsremained",60,60);//添加cookie记录,有效时间60s
settime(document.getElementById("valid_html"));//开始倒计时
}else{
alert(data);
valid_send_flag=true;
}
return;
}
});

}

}

</script>

</body>
</html>

转载于:https://www.cnblogs.com/shao-ss/p/7809523.html