Cordova / PhoneGap：setInterval（）/ setTimeout（）無法正常工作

Question

我使用window.setInterval實現了一個簡單的倒數計時器。 它在我的桌面瀏覽器中運行良好，但在我的智能手機（Fairphone 2）上無法正常使用PhoneGap / Cordova應用程序 。 根據我的檢查和我在互聯網上的研究，當手機被發送到睡眠/待機狀態時間隔/超時被中斷。 這就是為什么它不起作用。

令人驚訝的是，當我的手機通過usb線連接到我的電腦時，間隔/超時不會中斷。 所以這可能是一種導致不良行為的節能功能。

所以，我迷路了。 我不知道如何實現我的簡單倒計時器，當手機休眠時（=顯示器關閉）當然也應該工作。 window.setInterval（）/ window.setTimeout（）有替代方法嗎？

這是我的簡單代碼（如上所述：window.setTimeout也不起作用）：

...
<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" src="js/libs/jquery.js"></script>
<script>
    var min = 25;
    $(document).ready(function(){
        intervalID = window.setInterval(function () {
            --min;
            if (min > 0) {
                $("#countdown").text(min);
            }
        }, 6000);
    });
</script>
...
<p id="countdown">0m</p>

Answer 1

僅使用間隔計時器更新顯示。 使用系統時間來決定要顯示的內容。

然后，如果在顯示不可見時沒有調用間隔，則沒有問題。 下次調用時（再次打開顯示），它將從系統時間計算正確的經過時間，並將正確顯示。

出於這個原因（以及其他幾個），你永遠不應該假設setInterval()將保持完美的時間。 在Javascript中，它只是意味着您希望每隔一段時間調用一次，然后您可以設置指定頻率的大致時間，但間隔可能會長時間關閉。

獲取間隔以Date.now()開始的時間，然后每次間隔觸發時，獲取新的系統時間並從開始時間減去以查看已經過了多長時間，然后計算要顯示的內容。

如果你想在25分鍾的計時器上顯示剩余的分鍾數，你可以這樣做：

function showTimer(selector, minutes) {
  var startTime = Date.now();
  var interval;

  function showRemaining() {
    var delta = Date.now() - startTime;     // milliseconds
    var deltaMinutes = delta / (1000 * 60);
    if (deltaMinutes < minutes) {
      // display minutes remaining
      $(selector).text(Math.round(minutes - deltaMinutes));
    } else {
      $(selector).text(0);
      clearInterval(interval);
    }
  }

  interval = setInterval(showRemaining, 15 * 1000);
  showRemaining();
}

$(document).ready(function(){
  showTimer("#countdown", 25);
});

工作演示： https ： //jsfiddle.net/jfriend00/807z860p/

Answer 2

我找到了一個cordova插件，即使顯示器關閉也會執行超時/間隔：

cordova-plugin-timers （在github上 ）

jfriend00的答案也很有幫助。