JQuery---点击获取验证码后倒计时,刷新页面倒计时不失效

     采用通过添加Cookie的方式实现页面刷新后倒计时仍有效,亲测有效!
1.Html部分:

//导入JS文件




2.JS代码部分:

 //发送验证码时添加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);
    }
    //加载页面时获取Cookie并判断
$(document).ready(function(){
    var obj1 = $("#btnYZM");
    v = getCookieValue("secondsremained");//获取cookie值
    if(v>0){
        settime(obj1);//开始倒计时
    }
});
//定义倒计时变量
var countdown;
//点击函数
function getYZM() {
    var mobile = $("#mobile").val();
    var obj = $("#btnYZM");
      if (mobile) {
        addCookie("secondsremained", 60, 60);//添加cookie记录,有效时间60s
        settime(obj);//开始倒计时
            }
}
// 倒计时函数
function settime(obj) { //发送验证码倒计时
    countdown=getCookieValue("secondsremained");
    if (countdown === "0") {
        obj.attr('disabled',false);
        //obj.removeattr("disabled");
        obj.val("点击获取验证码");
        return;
    } else {
        obj.attr('disabled',true);
        obj.val("重新发送(" + countdown + ")");
        countdown--;
        editCookie("secondsremained",countdown,countdown+2);
    }
    setTimeout(function() {
            settime(obj) }
        ,1000)
}

你可能感兴趣的:(Java工作)