javascript中未顯示倒數計時器

Question

我是Java語言的新手，我想用localStorage創建一個倒計時計時器，該計時器從給定時間開始，到00:00:00結束，但是它不起作用，當我運行我的代碼時，它顯示值“ 1506”。

這是我的代碼

<script type="text/javascript">
            if (localStorage.getItem("counter")) {
                var CurrentTime = localStorage.getItem("counter");
            }
            else {
                var Hour = 3;
                var Minute = 25;
                var Second = 60;
                var CurrentTime = Hour.toString() + ":" + Minute.toString() + ":" + Second.toString();
            }


            function CountDown() {                                
                document.getElementById('lblDuration').innerHTML = CurrentTime;
                Second--;
                if (Second == -1) {
                    Second = 59;
                    Minute--;
                }
                if (Minute == -1) {
                    Minute = 59;
                    Hour--;
                }
                localStorage.setItem("counter", CurrentTime);
            }

            var interval = setInterval(function () { CountDown(); }, 1000);

    </script>

Answer 1

1. 您需要在變量if else聲明變量Hour, Minute, Second, CurrentTime 。 在這種情況下，它們不在function CountDown()范圍內。
2. 您沒有設置CurrentTime = Hour.toString() + ":" + Minute.toString() + ":" + Second.toString(); 在localStorage.setItem("counter", CurrentTime);

 var Hour = 3; var Minute = 25; var Second = 60; var CurrentTime = Hour.toString() + ":" + Minute.toString() + ":" + Second.toString(); function CountDown() { document.getElementById('lblDuration').innerHTML = CurrentTime; Second--; if (Second == -1) { Second = 59; Minute--; } if (Minute == -1) { Minute = 59; Hour--; } CurrentTime = Hour.toString() + ":" + Minute.toString() + ":" + Second.toString(); } setInterval(function () { CountDown(); }, 1000); 

 <div id="lblDuration"></div> 

Answer 2

當localStorage可用時，您無需設置小時，分鍾和秒的值。 因此，執行倒數計時功能時，它會發現Second未定義，並且語句Second--將Second轉換為NaN。 要解決此問題，只需初始化小時，分鍾和秒變量。 我對您的代碼進行了重構，希望對您有所幫助：

function CountDown() { 
    var currentTime =  getCurrentTime();                           
    printCurrentTime(currentTime)
    currentTime.second--;
    if (currentTime.second == -1) {
        currentTime.second = 59;
        currentTime.minute--;
    }
    if (currentTime.minute == -1) {
        currentTime.minute = 59;
        currentTime.hour--;
    }
    setCurrentTime(currentTime);
}

  function setCurrentTime(newCurrentTime){
    if(localStorage) localStorage.setItem("counter", JSON.stringify(newCurrentTime));
    else setCurrentTime.storage = newCurrentTime;
  }
  function getCurrentTime(){
    var result = localStorage ? localStorage.getItem("counter") : setCurrentTime.storage;
    result = result || {hour:3, minute:25, second:60};
    if (typeof(result) === "string")result = JSON.parse(result);
    result.toString = function(){
        return result.hour +  ":" + result.minute + ":" + result.second;
    }
    return result;
  }
  function printCurrentTime(currentime){
        var domTag = document.getElementById('lblDuration');
        if(domTag) domTag.innerHTML = currentime.toString();
        else console.log(currentime);
  }
setInterval(function () { CountDown(); }, 1000);