JavaScript倒數計時器

我想讓這個JavaScript倒數計時器顯示01，而不是1和00，當該部分沒有任何內容時。基本上，我只是想使它看起來像一個數字時鐘，但它看起來奇怪，當世界上沒有0使它擠進JavaScript倒數計時器

繼承人的腳本，我發現：

// JavaScript Document 

CountDownTimer('03/25/2013 9:0 AM', 'countdownSpring'); 
CountDownTimer('06/10/2013 9:0 AM', 'countdownSummer'); 
CountDownTimer('11/27/2013 9:0 AM', 'countdownFall'); 
CountDownTimer('12/23/2013 9:0 AM', 'countdownWinter'); 

function CountDownTimer(dt, id) 
{ 
    var end = new Date(dt); 

    var _second = 1000; 
    var _minute = _second * 60; 
    var _hour = _minute * 60; 
    var _day = _hour * 24; 
    var timer; 

    function showRemaining() { 
     var now = new Date(); 
     var distance = end - now; 
     if (distance < 0) { 

      clearInterval(timer); 
      document.getElementById(id).innerHTML = 'CAMP IS HERE!'; 

      return; 
     } 
     var days = Math.floor(distance/_day); 
     var hours = Math.floor((distance % _day)/_hour); 
     var minutes = Math.floor((distance % _hour)/_minute); 
     var seconds = Math.floor((distance % _minute)/_second); 

     document.getElementById(id).innerHTML = days + ':'; 
     document.getElementById(id).innerHTML += hours + ':'; 
     document.getElementById(id).innerHTML += minutes + ':'; 
     document.getElementById(id).innerHTML += seconds; 
    } 

    timer = setInterval(showRemaining, 1000); 
}

來源

2013-03-11 M_and_o

好了，你可以隨時將它添加到頁面之前測試值，並做出相應的調整，即：

var daysString; 
if (days == 0) { daysString = "00"; } 
else if (days < 10) { daysString = "0" + days; } 
else { daysString = "" + days; } 
document.getElementById(id).innerHTML = daysString + ':';

來源

2013-03-11 22:10:54 Steve

一種方式做到這一點是創建一個數字的擴展，這樣的事情：

Number.prototype.useLeadingZero = function() { 
    return (this < 10 ? "0" : "") + this; 
};

然後，您可以使用它是這樣的：

document.getElementById(id).innerHTML = days.useLeadingZero() + ':' + 
             hours.useLeadingZero() + ':' + 
             minutes.useLeadingZero() + ':' + 
             seconds.useLeadingZero();

Working demo

來源

2013-03-11 22:14:00

您可以使用一個簡單的功能，如：

function pad(n) { 
    return (n<10? '0':'') + n; 
}

則：

document.getElementById(id).innerHTML = pad(days) + ':' + pad(hours) + ':' + 
             pad(minutes) + ':' + pad(seconds);

或

document.getElementById(id).innerHTML = [pad(days),pad(hours),pad(minutes), pad(seconds)].join(':');

來源

2013-03-11 22:16:27 RobG

一些改變你的Javascript源

  var cdTimer; 
     function CountDownTimer(dt, elementID) 
     { 
      var end = new Date(dt); 

      var _second = 1000; 
      var _minute = _second * 60; 
      var _hour = _minute * 60; 
      var _day = _hour * 24; 

      cdTimer = setInterval(function() { showRemaining(end, _second, _minute, _hour, _day, elementID) }, 1000); 
     } 
     function showRemaining(end, _second, _minute, _hour, _day, elementID) 
     { 
      var $updateElement = $('#' + elementID); 
      var now = new Date(); 
      var distance = end - now; 
      if (distance < 0) 
      { 

       clearInterval(cdTimer); 
       $updateElement.html('CAMP IS HERE!'); 

       return; 
      } 
      var days = Math.floor(distance/_day); 
      var hours = Math.floor((distance % _day)/_hour); 
      var minutes = Math.floor((distance % _hour)/_minute); 
      var seconds = Math.floor((distance % _minute)/_second); 

      $updateElement.html(days + ' ' + Right('00' + hours, 2) + ':' + Right('00' + minutes, 2) + ':' + Right('00' + seconds, 2)); 
     } 
     function Right(str, n) 
     { 
      if (n <= 0) 
      { 
       return ""; 
      } 
      else if (n > String(str).length) 
      { 
       return str; 
      } 
      else 
      { 
       var iLen = String(str).length; 
       return String(str).substring(iLen, iLen - n); 
      } 
     }   
     $(document).ready(function() { 
      CountDownTimer('03/25/2013 9:0 AM', 'countdownSpring'); 
      CountDownTimer('06/10/2013 9:0 AM', 'countdownSummer'); 
      CountDownTimer('11/27/2013 9:0 AM', 'countdownFall'); 
      CountDownTimer('12/23/2013 9:0 AM', 'countdownWinter'); 
     });

（我已經使用jquery chenged）

來源

2013-03-11 22:34:31 AkisC

JavaScript倒數計時器

回答

相關問題