手机端验证码倒计时(切换后台再返回时time实时变化)

在开发APP时有个获取验证码倒计时功能

本来做的是直接 填充60S 计时器每秒 -1 发现切换后台后再进入

倒计时的时间还是从切出app的时间开始计算

于是重新做了一个和时间同步的计时器

function codeBtnStatus(){
            let box = $('.box');
            let date = new Date();
            let second = String(date.getTime()/1000);	// 获取 点击瞬间秒数

            box.addClass('active').text('60s');	// 将倒计时的盒子颜色改变,并赋值60s
            
            second = Number(second.substring(0,second.indexOf('.')));	// 将秒后面的数值剪掉

            count = setInterval(()=>{
                let new_date = new Date();
                let new_second = String(new_date.getTime()/1000);	// 获取 最新秒数
                new_second = Number(new_second.substring(0,new_second.indexOf('.')));
                let time = 60 - ( new_second - second ); 
                // 倒计时时间 = 60s - ( 最新秒数 - 点击瞬间秒数 )	

                if( time < 1 ){
                    box.removeClass('active').text('获取验证码');
                    clearTimeout(count);	//清除定时器
                } else {
                    box.text( `${time}s` );
                }
            },1000);
        }

收工.

你可能感兴趣的:(手机端验证码倒计时(切换后台再返回时time实时变化))