浏览器失焦时JQuery计时器暂停... [英] JQuery timer pausing when browser is out of focus...
问题描述
您好专家，我正在建立在线考试申请表。它有一个Jquery计时器...一切正常......但我最近注意到，当考生最小化时，打开其他标签...或者基本上浏览器没有焦点... jquery计时器暂停...之后当然，如果我再次打开浏览器，计时器将从浏览器最小化时的值再次启动。我不知道这里的问题是什么。我已经使用了jquery库的旧版本和新版本...并尝试了各种各样的东西，但似乎没有任何工作。这个问题在mozilla和chrome中仍然存在......但是赞成IE并没有显示出这个问题...我怎样才能解决这个问题...因为现在大多数人都不使用IE ......即使他们这样做了，我们也可以'不确定，他们总是会使用IE浏览器。
这里有一段jQUery代码：
var countdownTimer，countdownCurrent;
$（ document ）。ready（ function （）{
countdownCurrent = $ （' ＃ctl00_MainContent_example2submit'）。val（）* 100 ;
countdownTimer = $ .timer（ function （）{
var min = parseInt （countdownCurrent / 6000 ）;
var sec = parseInt （countdownCurrent / 100 ） - （min * 60 ）;
var micro = pad（countdownCurrent - （sec * 100 ） - （min * 6000 ）， 2 ）;
var output = 00; if （min> 0 ）{output = pad（min， 2 ）; }
$（' 。countdowntime'）。html（output + ： + pad（sec， 2 ）+ ： + micro）;
if （countdownCurrent == 0 ）{
$（' ＃ctl00_MainContent_btnNext'）。click（）;
} else {
countdownCurrent - = 7 ;
if （countdownCurrent< 0 ）{countdownCurrent = 0 ; }
}
}， 70 ， true ）;
$（' ＃example2submit'）。bind（' keyup'， function （e）{ if （e.keyCode == 13 ）{countdownReset（）;}}）;
}）;
function CheckIfOptionSelected（）{
var vFlag = 真;
var radioButton1 = document .forms [ 0 ]。elements [' ctl00_MainContent_rdBtnListOptions_0'];
var radioButton2 = document .forms [ 0 ]。elements [' ctl00_MainContent_rdBtnListOptions_1'];
var radioButton3 = document .forms [ 0 ]。elements [' ctl00_MainContent_rdBtnListOptions_2'];
var radioButton4 = document .forms [ 0 ]。elements [' ctl00_MainContent_rdBtnListOptions_3'];
if （radioButton1.checked == false && radioButton2。已检查== false && radioButton3.checked == false && radioButton4.checked = = false && countdownCurrent> 0 ）{
vFlag = 假;
}
else {
countdownReset（）;
vFlag = true ;
}
return vFlag;
}
function countdownReset（）{
var newCount = parseInt （$（' ＃ctl00_MainContent_example2submit'）。val（））* 100 ;
if （newCount> 0 ）{countdownCurrent = newCount; }
}
// 填充函数
function pad（number，length）{
var str = ' ' + number;
while （str.length< length）{str = ' 0' + str; }
return str;
}
编辑
这是小提琴。 ..它显示了我上面提到的确切问题...只是最小化或打开另一个选项卡并在那里工作一段时间...然后再次关注计时器运行的浏览器...你会看到计时器已经没过多了...... http：//jsfiddle.net/mlimbu/wLk5b/3/
（文档）。ready（ function （）{
countdownCurrent =
（' ＃ctl00_MainContent_example2submit'）。val（）* 100 ;
countdownTimer =
.timer（ function （）{
var min = parseInt （countdownCurrent / 6000 ）;
var sec = parseInt （countdownCurrent / 100 ） - （min * 60 ）;
var micro = pad（countdownCurrent - （sec * 100 ） - （min * 6000 ）， 2 ）;
var output = 00; if （min> 0 ）{output = pad（min， 2 ）; }
Hello experts, i am building an online exam application. It has a Jquery timer...everything works fine...but i recently noticed that when the examinee minimizes, opens other tabs...or basically the browser is out of focus...the jquery timer pauses...after a certain while, if i again open the browser, the timer starts again from the value it had when the browser was minimized. I don''t know what the issue here is. I''ve used both older and newer version of the jquery library...and tried all sorts of things, but nothing seems to work. This problem persists in mozilla and chrome...but suprizingly IE does not show this problem...How can i resolve this issue...as most people do not use IE these days...even if they did, we can''t be sure that, they''ll always use IE.
Here is a snipped of the jQUery code:
var countdownTimer, countdownCurrent;
$(document).ready(function () {
countdownCurrent = $('#ctl00_MainContent_example2submit').val() * 100;
countdownTimer = $.timer(function () {
var min = parseInt(countdownCurrent / 6000);
var sec = parseInt(countdownCurrent / 100) - (min * 60);
var micro = pad(countdownCurrent - (sec * 100) - (min * 6000), 2);
var output = "00"; if (min > 0) { output = pad(min, 2); }
$('.countdowntime').html(output + ":" + pad(sec, 2) + ":" + micro);
if (countdownCurrent == 0) {
$('#ctl00_MainContent_btnNext').click();
} else {
countdownCurrent -= 7;
if (countdownCurrent < 0) { countdownCurrent = 0; }
}
}, 70, true);
$('#example2submit').bind('keyup', function (e) { if (e.keyCode == 13) { countdownReset(); } });
});
function CheckIfOptionSelected() {
var vFlag = true;
var radioButton1 = document.forms[0].elements['ctl00_MainContent_rdBtnListOptions_0'];
var radioButton2 = document.forms[0].elements['ctl00_MainContent_rdBtnListOptions_1'];
var radioButton3 = document.forms[0].elements['ctl00_MainContent_rdBtnListOptions_2'];
var radioButton4 = document.forms[0].elements['ctl00_MainContent_rdBtnListOptions_3'];
if (radioButton1.checked == false && radioButton2.checked == false && radioButton3.checked == false && radioButton4.checked == false && countdownCurrent > 0) {
vFlag = false;
}
else {
countdownReset();
vFlag = true;
}
return vFlag;
}
function countdownReset() {
var newCount = parseInt($('#ctl00_MainContent_example2submit').val()) * 100;
if (newCount > 0) { countdownCurrent = newCount; }
}
// Padding function
function pad(number, length) {
var str = '' + number;
while (str.length < length) { str = '0' + str; }
return str;
}
EDIT
Here is the fiddle...and it is showing the exact problem i mentioned above...just minimize or open another tab and work there for a while...then again focus the browser where the timer is running...you''ll see that the timer has not elpsed much...http://jsfiddle.net/mlimbu/wLk5b/3/
(document).ready(function () { countdownCurrent =
('#ctl00_MainContent_example2submit').val() * 100; countdownTimer =
.timer(function () { var min = parseInt(countdownCurrent / 6000); var sec = parseInt(countdownCurrent / 100) - (min * 60); var micro = pad(countdownCurrent - (sec * 100) - (min * 6000), 2); var output = "00"; if (min > 0) { output = pad(min, 2); }
这篇关于浏览器失焦时JQuery计时器暂停...的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
