當瀏覽器不在焦點時jQuery計時器暫停

我在Chrome和Mozilla中遇到了這個問題，而IE正常工作。當我最小化瀏覽器或打開新選項卡並在該選項卡上工作一段時間後，計時器暫停，但如果Web應用程序再次處於焦點狀態，則會再次恢復。我知道這是由於時間的差異，例如大約一分鐘左右後，當我返回到Web應用程序時，只有一秒左右的時間已過。我不知道是什麼導致了這個問題。當瀏覽器不在焦點時jQuery計時器暫停

這裏是jQuery的片斷，我用，定時器可以從這裏http://code.google.com/p/jquery-timer/

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; } 
     countdownTimer.stop().once(); 
       } 

    // Padding function 
    function pad(number, length) { 
     var str = '' + number; 
     while (str.length < length) { str = '0' + str; } 
     return str; 
    }

來源

2013-03-31 Mingsho Nembang

這裏的實際問題是什麼？換句話說，你想要頁面有什麼行爲？忘掉jQuery和定時器等等，並詳細描述你正在試圖讓頁面做什麼。另外請注意，定時器並不精確。即使頁面打開，計時器可能會比預期的晚。如果你正在更新時間顯示，你不能根據定時器發射的次數。您需要使用Date對象。 –

感謝邁克爾的答覆......我只想讓考生有一個有限的時間來回答問題。如果他們耗盡時間，即在檢測到定時器elpase之後... jquery點擊下一個按鈕，並且考生將會看到下一個問題。我面臨的問題是......如果考生只是最小化了瀏覽器，計時器會暫停，他將在世界上的所有時間做任何事情。我想阻止這一點。而且你提到了日期對象......可以將它們用於這樣的目的嗎？ –

感謝您澄清，這非常有幫助。我想我對你有一些想法 - 我把它寫成答案，以便我可以正確地格式化代碼。 –

下載我看了看那個的jQuery插件計時器，我不喜歡太多的代碼。對於一項簡單的任務來說，這看起來並不複雜這樣的代碼並不能使人確信：

if(typeof func == 'object') { 
    var paramList = ['autostart', 'time']; 
    for(var arg in paramList) {if(func[paramList[arg]] != undefined) {eval(paramList[arg] + " = func[paramList[arg]]");}}; 
    func = func.action; 
}

與一些急需換行和註釋重新格式化補充說：

if(typeof func == 'object') { 
    var paramList = ['autostart', 'time']; 
    // Never use for..in to iterate over an array 
    for(var arg in paramList) { 
     if(func[paramList[arg]] != undefined) { 
      // What does this eval code do and why? 
      eval(paramList[arg] + " = func[paramList[arg]]"); 
     } 
    }; 
    func = func.action; 
}

如果你需要一個可行的計時器，爲什麼不採取更簡單的方法和使用瀏覽器的setInterval()或setTimeout()直接？如果您需要知道已經過了多長時間，請使用+new Date以毫秒爲單位獲取當前時間，並根據需要進行相減。

這是一個測試頁面，顯示頁面加載後的秒數。這是純粹的原生HTML和JavaScript代碼，我認爲它應該適用於每個瀏覽器。特別是，當IE最小化時，它按預期工作。你可以以此爲起點，一個簡單和可靠的解決方案：

<!DOCTYPE html> 

<html> 
<head> 
    <title>Time Test</title> 
</head> 
<body> 

    <code> 
     This page has been open for 
     <span id="timeOpen">0</span> 
     seconds 
    </code> 

    <script> 
     var timeStart = +new Date; 
     setInterval(function() { 
      var timeNow = +new Date; 
      var secondsOpen = (timeNow - timeStart)/1000; 
      document.getElementById('timeOpen').innerHTML = 
       Math.floor(secondsOpen); 
     }, 250); 
    </script> 

</body> 
</html>

這裏還有一個fiddle代碼。

來源

2013-04-02 08:26:50

你好邁克爾感謝您的回覆......我不是很擅長Jquery ......還在學習......我只是下載免費代碼並在我的asp.net應用程序中引用它們......上面的代碼看起來像gr8並承諾..我會嘗試在我的網站... thaks再次的人。乾杯! –

當瀏覽器不在焦點時jQuery計時器暫停

回答

相關問題