0

这是我的代码：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script>

var myseconds = 20;
var mycolor = 'rgba(255, 100, 0, 0.8)';

//alert('You will have '+Math.floor(myseconds/60)+' minutes and '+myseconds%60+' seconds to finish. Press “OK” to begin.');

$(function(){
$('div#pie_to_be').pietimer({
seconds: myseconds,
color: mycolor
},
function(){ $('#caspioform').submit(); });});
(function($){jQuery.fn.pietimer=function(options,callback){var settings={'seconds':10,'color':'rgba(255, 255, 255, 0.8)','height':this.height(),'width':this.width()};if(options){$.extend(settings,options);}this.html('<canvas id="pie_timer" width="'+settings.height+'" height="'+settings.height+'">'+settings.seconds+'</canvas>');var val=360;interval=setInterval(timer,40);function timer(){var canvas=document.getElementById('pie_timer');if(canvas.getContext){val-=(360/settings.seconds)/24;if(val<=0){clearInterval(interval);canvas.width=canvas.width;if(typeof callback=='function'){callback.call();}}else{canvas.width=canvas.width;var ctx=canvas.getContext('2d');var canvas_size=[canvas.width,canvas.height];var radius=Math.min(canvas_size[0],canvas_size[1])/2;var center=[canvas_size[0]/2,canvas_size[1]/2];ctx.beginPath();ctx.moveTo(center[0],center[1]);var start=(3*Math.PI)/2;ctx.arc(center[0],center[1],radius,start-val*(Math.PI/180),start,false);ctx.closePath();ctx.fillStyle=settings.color;ctx.fill();}}}return this;};})(jQuery);
</script>

这是一个饼图计时器，它随着页面加载开始运行。但是当我切换浏览器选项卡时，它会停在那里。然后当我回到那个选项卡时，它会从它停止的地方恢复。请告诉我怎样才能让它在后台运行（即即使标签对用户不可见）。

4

2 回答 2

4

不要依赖setInterval定时器是一致的。它会有所不同，即使在前台也是如此。相反，当setInterval火灾发生时，读取实际时间并使用它来计算新位置应该是什么。那样的话，计时器会看起来在后台运行，即使它不是。

于 2013-07-17T12:13:52.647 回答
1

尝试更新 jQuery。较新的版本具有与间隔相关的修复。

于 2013-07-17T12:16:10.983 回答