倒计时问题

倒计时问题

之前接到一个产品需求：输入完手机号——> 下一步 ——> 倒计时开始 ——> 返回 ——> 手机号输入页面 ——> 下一步 ——>倒计时正常
这里涉及到2个问题：
1、验证完手机号会向后台发送请求，返回成功开始倒计时，当你返回在30秒再下一步时第二次发送请求，后台会向你抛出一个”短信发送过于平凡，请稍后再试”，这样的话就不在走到下一个页面了，要等到30秒后才能流到下一个页面

2、如果过了30秒到下一个页面而且在60秒之内，意味着倒计时还在进行中，你又让倒计时启动，会出现二个时间切换倒计时(因为用了setInterval()方法必须要用clearInterval()方法才能让其中止，否则会一直执行到结束)，这样就会有bug了

为了解决这个问题我的解决办法就是返回到上一个页面再到下一步时判断是否在60秒之内，如果在60秒之内不请求后台继续倒计时
a、开始倒计时时把当前时间存在本地(localstorage new Date())
b、下一步时从缓存里把本地时间取出来和点击一步时的时间比较是否大于60秒(这里多加一个判断是否是同一个手机号，不同手机号直接请求后台不管时间多少)。如果：

说明：一开始用的存储方法是H5的sessionStorage，但后来在华为一个很旧的手机发送有bug，所以换成了cookie存储方式

var resendTimer, wait, mobKey;
var timeFun = {
//存储开始倒计时的时间
setTimeFun:function(obj){
    var mobKey = $(obj).val().toString();
    var myTime=new Date();
    timeFun.setCookie('oldTime', myTime);//时间
    timeFun.setCookie('tel', mobKey);    //手机号
    //sessionStorage.setItem('oldTime',myTime);//时间
    //sessionStorage.setItem('tel',mobKey); //手机号
},
setKey:function(){
    var keyVal = $("input[name='key']").val().toString();
    //sessionStorage.setItem('key',keyVal); //把key存在本地
    timeFun.setCookie('key', keyVal);
},
//当验证码通过后要清除sessionStorage里面的存储的时间
removeTimeFun:function(){
    //sessionStorage.removeItem('oldTime');
    //sessionStorage.removeItem('tel');
    //sessionStorage.removeItem('key');

    timeFun.setCookie('oldTime', "");
    timeFun.setCookie('tel', "");
    timeFun.setCookie('key', "");
},
//把存储的时间取出来，如果之前没有存储则返回null
getTimeFun:function(obj){
    var getItemTime = timeFun.getCookie("oldTime"); //sessionStorage.getItem('oldTime');
    var getItemMob = timeFun.getCookie("tel"); //sessionStorage.getItem('tel');
    obj.value = getItemTime + "+" + getItemMob;
},
//时间差:当在60秒之内时，当前时间减去上次开始倒计时时间剩余的秒数
timeDifferFun:function(){
    var diff;
    var now=new Date();
    var t = timeFun.getCookie("oldTime"); //sessionStorage.getItem('oldTime')
    var getTimeObj = new Date(t);//把字符串转化成时间
    if(t == null){
        diff = 60;//60:代表第一次发送验证码或验证码发送时间超过60s时间
    }else{
        var timeDiff = Math.floor((now.getTime() - getTimeObj.getTime())/1000);
        if(timeDiff < 60){
            diff = 60 - timeDiff;
        }else{
            diff = timeDiff;
        }
    }
    return diff;
},
//判断如果不同手机号码或者时间间隔大于60s则发送验证码，反之直接切换下一个页面不发送，继续上次倒计时
compareMoblie:function(obj){
    var m = timeFun.getCookie(" tel"); //sessionStorage.getItem('tel');
    if (m == null) {
        return true;
    }

    var mobKey = $(obj).val();
    if(mobKey != m){
        clearInterval(Tid);
        $mobileCodeBtn.text('重新发送');
        return true;
    }

    if (timeFun.timeDifferFun() > 60) {
        return true;
    }
    return false; //返回为true向后台发送请求
},

setCookie:function(name, value) {
    var Days = 1;
    var exp = new Date();
    exp.setTime(exp.getTime() + Days*24*60*60*1000);
    document.cookie = name + "="+ escape(value) + ";expires=" + exp.toGMTString()+';Path='+basePath+'/';
},

getCookie:function(name) {
    var arrStr = document.cookie.split(";");
    for (var i = 0; i < arrStr.length; i++) {
        var temp = arrStr[i].split("=");
        if (temp[0] == name) {
            return unescape(temp[1]);
        }
    }
}

}

欢迎指点