我setInterval每秒运行一段代码30次.这很好用,但是当我选择另一个选项卡(以便我的代码的选项卡变为非活动状态)时,由于setInterval某种原因将其设置为空闲状态.
我做了这个简化的测试用例(http://jsfiddle.net/7f6DX/3/):
var $div = $('div');
var a = 0;
setInterval(function() {
a++;
$div.css("left", a)
}, 1000 / 30);
如果您运行此代码然后切换到另一个选项卡,等待几秒钟然后返回,动画将继续在您切换到另一个选项卡时的位置.因此,如果选项卡处于非活动状态,则动画不会每秒运行30次.这可以通过计算setInterval每秒调用函数的次数来确认- 如果选项卡处于非活动状态,则不会是30,而只是1或2.
我想这是通过设计完成的,以提高性能,但有没有办法禁用这种行为？在我的场景中,它实际上是一个缺点.
背景:我正在做一些需要检测人们是否注意的用户界面测试.但是,这个问题是不是有关的页面知名度API.
具体来说,我想知道如果在不同的浏览器中当前选项卡未激活或浏览器窗口未激活,我的Javascript代码将如何受到影响.到目前为止,我已经挖出了以下内容:
setInterval而setTimeout当标签不主动延迟降低 -看起来这只是最近开始出现,并可以搞砸茉莉花单元测试,周围的其他事物.requestAnimationFrame 选项卡未激活时速度变慢(合理,无法想到为什么这会对任何人造成太大影响)我有以下问题:
setInterval重复？它只是减少到一个限度或一个百分比？例如,如果我有一个10ms重复而不是5000ms重复,那么每个都会受到怎样的影响？我有一个小网页,可以播放我可以在手机上收听的音乐.页面上的JavaScript设置超时,加载下一首歌曲并在第一首歌曲结束时播放.
选项卡处于活动状态时,一切正常.但是在标签变为非活动状态后,超时会继续工作几分钟,然后一旦当前播放的歌曲结束,下一首歌就不会加载或播放.
我假设这是因为Chrome暂停了非活动标签的JavaScript执行,但我不想在我播放音乐的整个过程中保持屏幕.
我已经使用Chrome移动调试器调试了代码,方法是设置超时,每隔500毫秒运行一次,显示当前日期.一旦屏幕变黑,超时将下降到每1000毫秒一次,这是预期的,但几分钟后,超时完全停止.但是,一旦选项卡再次处于活动状态,所有暂停的超时都会激活并运行.
Chrome会将setInterval/setTimeout更改为1000毫秒,但是暂停执行会使我的整个页面停止工作.
我试图保持标签处于活动状态,每隔一段时间就运行一次AJAX请求,但这些请求也会暂停.我没有尝试过让JavaScript继续运行.
基本上,有没有办法解决这个问题？有没有办法在屏幕关闭时保持标签处于活动状态？