关于移动端浏览器定时器后台停止运行的问题
来源:互联网 发布:电力网络大学视频 编辑:程序博客网 时间:2024/06/04 18:02
关于移动端浏览器定时器后台停止运行的问题
今天在做微信浏览器端的商城项目的时候遇到了一个问题,具体场景是这样的:在页面添加了一个定时器,某项数据每秒递减,当手机锁屏或者后台运行时再返回页面,发现定时器在后台运行时停止了,返回才继续开始运行。
解决方法:
这里我是用的是一个H5的一个PageVisibility API,在这里,我们可以得到两个属性及其参数,用来表示当前页面是否可见:
- document.visibilityState:hidden/visiable/preview
- document.hidden:true/false
对于我的问题,我是这样解决的
document.addEventListener('visibilitychange',function() { if(document.visibilityState=='visible') { location.reload(true); }})document.addEventListener('webkitvisibilitychange',function() { if(document.webkitVisibilityState=='visible') { location.reload(true); }})document.addEventListener('mozvisibilitychange',function() { if(document.mozVisibilityState=='visible') { location.reload(true); }})document.addEventListener('msvisibilitychange',function() { if(document.msVisibilityState=='visible') { location.reload(true); }})
以上虽然是兼容写法,但这种新特性不太适合旧版本的浏览器,对于移动端可以放心使用,安卓/iOS测试通过。
意思是,通过visibilitychange事件监听当前页面可见性的变化,当前页面可见时,页面刷新,我就可以从后台拿到最新数据,当然,如果不想从后台拿数据,你可以这么办:
document.addEventListener('visibilitychange',function() { var d = new Date(); var b = 0; if(document.visibilityState=='hidden') { b = Math.floor(d.getTime()/1000); }else { screenCloseTime = Math.floor((d.getTime() - b)/1000); } })
这样你就拿到了页面关闭了的时间,然后在页面打开时补上页面时间差。
需要注意的是安卓和iOS的情况可能不一样,需要分设备对待。
说到这个新特性,我们可以很容易的想到他的应用场景,比如:你想控制页面的动画在页面隐藏时暂停,返回时继续;也可以在页面不显示的时候,暂缓一些不必要的操作,可以达到减少客户端、服务端压力的目的等。总之,这个特性在某些场景下还是非常实用的。
阅读全文
0 0
- 关于移动端浏览器定时器后台停止运行的问题
- ORACLE定时器停止运行
- Android后台运行的定时器实现
- 一些前台后台的关于浏览器差异的问题
- 关于浏览器的请求数据到达后台乱码问题
- iOS后台运行定时器
- iOS 定时器后台运行
- 关于hudson server运行testcase时浏览器进程后台运行
- 关于线程的停止问题
- IE浏览器已停止工作的问题
- 关于移动端的问题
- 【开发过程问题汇总系列】【定时器】Timer运行的过程中把系统时间修改为以前的时间会停止运行的问题
- Android视频播放时停止后台运行的方法
- 关于浏览器不能运行JavaScrip问题的反思
- 运行exe停止工作的一个问题
- C#中定时器停止问题
- 关于在ie8下用vs2005运行调试,自动停止的问题
- IE浏览器提示"是否停止运行此脚本"的解决方法
- Java5、Java6、Java6、Java7、Java8的新特性
- 全球NB-IoT发展面临六大挑战
- freemarker总结
- [Object-C]_[C/C++]_[集合操作对比]
- 高清视频直播地址 测试地址 http rtsp rtmp 测试
- 关于移动端浏览器定时器后台停止运行的问题
- laravel优化性能
- 彻底理解android中的内部存储与外部存储
- 论文代发需要符合哪些要求
- 取数组最小值
- 筛法加强版
- ImageNet Evolution论文笔记(2)
- Solr之查询索引。
- form表单避免重复提交