cookie最初创建的有效时间是60秒.也就是说,你如果在倒计时为20的时候,关闭网页.20秒之后再打开,是不会有倒计时显示的;但是,如果倒计时为20时,关闭页面,如果在20秒内重新打开页面,是有倒计时显示的.
1
|
<
input
id
=
"second"
type
=
"button"
value
=
"免费获取验证码"
/>
|
2. [代码]js对cookie的操作
//发送验证码时添加cookie
function addCookie(name,value,expiresHours){
varcookieString=name+"="+escape(value);
//判断是否设置过期时间,0代表关闭浏览器时失效
if(expiresHours>0){
vardate=newDate();
date.setTime(date.getTime()+expiresHours*1000);
cookieString=cookieString+";expires="+ date.toUTCString();
}
document.cookie=cookieString;
}
//修改cookie的值
function editCookie(name,value,expiresHours){
varcookieString=name+"="+escape(value);
if(expiresHours>0){
vardate=newDate();
date.setTime(date.getTime()+expiresHours*1000);//单位是毫秒
cookieString=cookieString+";expires="+ date.toGMTString();
}
document.cookie=cookieString;
}
//根据名字获取cookie的值
function getCookieValue(name){
varstrCookie=document.cookie;
vararrCookie=strCookie.split("; ");
for(vari=0;i<arrCookie.length;i++){
vararr=arrCookie[i].split("=");
if(arr[0]==name){
returnunescape(arr[1]);
break;
}else{
return"";
break;
}
}
}
3. [代码]主要逻辑代码
$(function(){
$("#second").click(function(){
sendCode($("#second"));
});
v = getCookieValue("secondsremained");//获取cookie值
if(v>0){
settime($("#second"));//开始倒计时
}
})
//发送验证码
function sendCode(obj){
varphonenum = $("#phonenum").val();
varresult = isPhoneNum();
if(result){
doPostBack('${base}/login/getCode.htm',backFunc1,{"phonenum":phonenum});
addCookie("secondsremained",60,60);//添加cookie记录,有效时间60s
settime(obj);//开始倒计时
}
}
//将手机利用ajax提交到后台的发短信接口
function doPostBack(url,backFunc,queryParam) {
$.ajax({
async :false,
cache :false,
type :'POST',
url : url,// 请求的action路径
data:queryParam,
error :function() {// 请求失败处理函数
},
success : backFunc
});
}
function backFunc1(data){
vard = $.parseJSON(data);
if(!d.success){
alert(d.msg);
}else{//返回验证码
alert("模拟验证码:"+d.msg);
$("#code").val(d.msg);
}
}
//开始倒计时
var countdown;
function settime(obj) {
countdown=getCookieValue("secondsremained");
if(countdown == 0) {
obj.removeAttr("disabled");
obj.val("免费获取验证码");
return;
}else{
obj.attr("disabled",true);
obj.val("重新发送("+ countdown +")");
countdown--;
editCookie("secondsremained",countdown,countdown+1);
}
setTimeout(function() { settime(obj) },1000)//每1000毫秒执行一次
}
//校验手机号是否合法
function isPhoneNum(){
varphonenum = $("#phonenum").val();
varmyreg = /^(((13[0-9]{1})|(15[0-9]{1})|(18[0-9]{1}))+\d{8})$/;
if(!myreg.test(phonenum)){
alert('请输入有效的手机号码!');
returnfalse;
}else{
returntrue;
}
}
有点小bug.
主要逻辑代码,5行 改成 ,
v = getCookieValue("secondsremained")?
getCookieValue("secondsremained"):0;//获取cookie值
去掉下面的:
else{
return "";
break;
}