不管是Android还是iOS都存在息屏后，过了一段时间后定时器会停止工作，再次打开后才继续工作的问题，且息屏后多长时间定时器会停止工作不确定。
本回答只提供息屏后，定时器停止，而软件未被后台杀死的情况。
问题描述及需求
我们项目是一款运动型软件，定时器记录用户运动的时间，当用户进行跑步等有氧运动时，会进行息屏等操作。而定时器会在息屏一段时间后自动停止（可能是20秒可能是1分钟，也可能是5分钟），只有当再次打开时才会继续计时。
思路
通过监听 visibilitychange 事件，得知该页面是否为可见。
- 在息屏时，我们主动关闭定时器，并记录当前时间。
- 在用户打开手机进入页面时，记录当前时间，计算出息屏期间的时间。
- 再次打开定时器，并将计时器时间加上息屏期间的时间。
let _this = this;
document.addEventListener("visibilitychange", function() {
if (document.visibilityState == "hidden") {
console.log("close");
clearInterval(_this.timer); // 息屏时主动关闭定时器
_this.closeTiming = Date.now(); // 息屏时 记录息屏时间点
} else {
console.log("open");
// 获得息屏期间的时间， 并换算为秒 单位
_this.closeScreenDuringTime = Math.floor(
(Date.now() - _this.closeTiming) / 1000
);
// 原定时器需要计算的时间，加上息屏期间的时间就是总时间
_this.currentDuringTime =
_this.currentDuringTime + _this.closeScreenDuringTime;
_this.openTimer(); // 调用函数，再次打开定时器
}
});
其中 document.visibilityState 有两个值分别为 ‘hidden’ 和 ‘visible’ 。
如果存在兼容性问题 ， 也可以监听其他几个事件试试。
document.addEventListener("webkitvisibilitychange", function() {
});
document.addEventListener("mozvisibilitychange", function() {
});
document.addEventListener("msvisibilitychange", function() {
});
如有错误，欢迎指正，谢谢！
以上内容仅共参考，欢迎大家讨论。