橙子学院-30天专注橙长计划

手机锁屏后js倒计时停止问题

2017-05-22  本文已影响0人  非小惰

在开发过程中发现到我们锁屏或切到后台以后,h5界面写的js倒计时停止,不想通过原生监听,解决此问题尝试方法如下

1、h5自带属性,检测当前页面状态

document.hidden

document.mozHidden

document.msHidden

document.webkitHidden

为当前document添加监听addEventListener

经测试发现,在浏览器中可监听到,单手机的webview无法监听

更改思路如下

原本通过定时器每秒执行一次time--实现倒计时,现改为通过获取毫秒数,将两次事件相减,然后用60-差值进行时间的倒计时

(采用了比较low的方案,在此希望有更好方式的同学提供方案)代码如下

var time=60;

function setTime() {

var beforeTime = getTime();

window.setTimeInterval = setInterval(function(){

time =  time-(((getTime() - beforeTime)/1000).toFixed(0));

if(time <= 0){

$("#get_code").text('获取验证码');

clearInterval(setTimeInterval);

return time = 60;

}

$("#get_code").text(time + ' s');

beforeTime= getTime();

},1000);

}

//获取当前毫秒数

function getTime(){

return Date.now();

}

上一篇下一篇

猜你喜欢

热点阅读