将前导零添加到此JavaScript倒计时脚本？

我正在使用以下倒计时脚本，这很好用，但我无法弄清楚如何将前导零添加到数字中（例如，因此它显示09而不是9.）任何人都可以帮我解决问题吗？下面是当前的脚本：将前导零添加到此JavaScript倒计时脚本？

function countDown(id, end, cur){ 
     this.container = document.getElementById(id); 
     this.endDate = new Date(end); 
     this.curDate = new Date(cur); 


var context = this; 

var formatResults = function(day, hour, minute, second){ 
    var displayString = [ 
       '<div class="stat statBig">',day,'</div>', 
       '<div class="stat statBig">',hour,'</div>', 
       '<div class="stat statBig">',minute,'</div>', 
       '<div class="stat statBig">',second,'</div>' 
    ]; 
    return displayString.join(""); 
} 

var update = function(){ 
    context.curDate.setSeconds(context.curDate.getSeconds()+1); 

    var timediff = (context.endDate-context.curDate)/1000; 

    // Check if timer expired: 
    if (timediff<0){ 
     return context.container.innerHTML = formatResults(0,0,0,0); 
    } 

    var oneMinute=60; //minute unit in seconds 
    var oneHour=60*60; //hour unit in seconds 
    var oneDay=60*60*24; //day unit in seconds 

    var dayfield=Math.floor(timediff/oneDay); 
    var hourfield=Math.floor((timediff-dayfield*oneDay)/oneHour); 
    var minutefield=Math.floor((timediff-dayfield*oneDay-hourfield*oneHour)/oneMinute); 
    var secondfield=Math.floor((timediff-dayfield*oneDay-hourfield*oneHour-minutefield*oneMinute)); 

    context.container.innerHTML = formatResults(dayfield, hourfield, minutefield, secondfield); 

    // Call recursively 
    setTimeout(update, 1000); 
}; 

// Call the recursive loop 
update(); 
}

来源

2012-12-12 ejwgrant

你想检查这个问题：http://stackoverflow.com/questions/2686855/is-there-a-javascript-function-that-can-pad-a-string-to-get-to-a -deng-leng – buffcoredave

你只需要检查变量比10小的，并添加他们领先零。尝试以下操作：

function countDown(id, end, cur){ 
     this.container = document.getElementById(id); 
     this.endDate = new Date(end); 
     this.curDate = new Date(cur); 


var context = this; 

var formatResults = function(day, hour, minute, second){ 
    day = (day < 10) ? "0"+day : day; 
    hour = (hour < 10) ? "0"+hour : hour; 
    minute = (minute < 10) ? "0"+minute : minute; 
    second = (second < 10) ? "0"+second: second; 
    var displayString = [ 
       '<div class="stat statBig">',day,'</div>', 
       '<div class="stat statBig">',hour,'</div>', 
       '<div class="stat statBig">',minute,'</div>', 
       '<div class="stat statBig">',second,'</div>' 
    ]; 
    return displayString.join(""); 
} 

var update = function(){ 
    context.curDate.setSeconds(context.curDate.getSeconds()+1); 

    var timediff = (context.endDate-context.curDate)/1000; 

    // Check if timer expired: 
    if (timediff<0){ 
     return context.container.innerHTML = formatResults(0,0,0,0); 
    } 

    var oneMinute=60; //minute unit in seconds 
    var oneHour=60*60; //hour unit in seconds 
    var oneDay=60*60*24; //day unit in seconds 

    var dayfield=Math.floor(timediff/oneDay); 
    var hourfield=Math.floor((timediff-dayfield*oneDay)/oneHour); 
    var minutefield=Math.floor((timediff-dayfield*oneDay-hourfield*oneHour)/oneMinute); 
    var secondfield=Math.floor((timediff-dayfield*oneDay-hourfield*oneHour-minutefield*oneMinute)); 

    context.container.innerHTML = formatResults(dayfield, hourfield, minutefield, secondfield); 

    // Call recursively 
    setTimeout(update, 1000); 
}; 

// Call the recursive loop 
update(); 
}

更新：

您还可以使用@Alnitak溶液中，用功能包起来，效果是一样的，你会集中你的逻辑：

function countDown(id, end, cur){ 
     this.container = document.getElementById(id); 
     this.endDate = new Date(end); 
     this.curDate = new Date(cur); 


var context = this; 

var addLeadingZeros = function(number){ 
    return (number < 10) ? "0"+number : number; 
} 

var formatResults = function(day, hour, minute, second){ 
    day = addLeadingZeros(day); 
    hour = addLeadingZeros(hour); 
    minute = addLeadingZeros(minute); 
    second = addLeadingZeros(second); 
    var displayString = [ 
       '<div class="stat statBig">',day,'</div>', 
       '<div class="stat statBig">',hour,'</div>', 
       '<div class="stat statBig">',minute,'</div>', 
       '<div class="stat statBig">',second,'</div>' 
    ]; 
    return displayString.join(""); 
} 

var update = function(){ 
    context.curDate.setSeconds(context.curDate.getSeconds()+1); 

    var timediff = (context.endDate-context.curDate)/1000; 

    // Check if timer expired: 
    if (timediff<0){ 
     return context.container.innerHTML = formatResults(0,0,0,0); 
    } 

    var oneMinute=60; //minute unit in seconds 
    var oneHour=60*60; //hour unit in seconds 
    var oneDay=60*60*24; //day unit in seconds 

    var dayfield=Math.floor(timediff/oneDay); 
    var hourfield=Math.floor((timediff-dayfield*oneDay)/oneHour); 
    var minutefield=Math.floor((timediff-dayfield*oneDay-hourfield*oneHour)/oneMinute); 
    var secondfield=Math.floor((timediff-dayfield*oneDay-hourfield*oneHour-minutefield*oneMinute)); 

    context.container.innerHTML = formatResults(dayfield, hourfield, minutefield, secondfield); 

    // Call recursively 
    setTimeout(update, 1000); 
}; 

// Call the recursive loop 
update(); 
}

来源

2012-12-12 11:05:43

非常感谢，这是一个真正的帮助！ – ejwgrant

最简单的事情是在一个效用函数抛出垫你的号码：

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

来源

2012-12-12 11:05:10 Alnitak

这应有助于：

function countDown(id, end, cur){ 
     this.container = document.getElementById(id); 
     this.endDate = new Date(end); 
     this.curDate = new Date(cur); 


var context = this; 

var formatNum = function (num) { 
    if (num.toString().length < 2) { 
     return '0' + num; 
    }  
    return num; 
} 

var formatResults = function(day, hour, minute, second){ 
    formatNum(day); 
    formatNum(hour); 
    formatNum(minute); 
    formatNum(second);  
    var displayString = [ 
       '<div class="stat statBig">',day,'</div>', 
       '<div class="stat statBig">',hour,'</div>', 
       '<div class="stat statBig">',minute,'</div>', 
       '<div class="stat statBig">',second,'</div>' 
    ]; 
    return displayString.join(""); 
} 

var update = function(){ 
    context.curDate.setSeconds(context.curDate.getSeconds()+1); 

    var timediff = (context.endDate-context.curDate)/1000; 

    // Check if timer expired: 
    if (timediff<0){ 
     return context.container.innerHTML = formatResults(0,0,0,0); 
    } 

    var oneMinute=60; //minute unit in seconds 
    var oneHour=60*60; //hour unit in seconds 
    var oneDay=60*60*24; //day unit in seconds 

    var dayfield=Math.floor(timediff/oneDay); 
    var hourfield=Math.floor((timediff-dayfield*oneDay)/oneHour); 
    var minutefield=Math.floor((timediff-dayfield*oneDay-hourfield*oneHour)/oneMinute); 
    var secondfield=Math.floor((timediff-dayfield*oneDay-hourfield*oneHour-minutefield*oneMinute)); 

    context.container.innerHTML = formatResults(dayfield, hourfield, minutefield, secondfield); 

    // Call recursively 
    setTimeout(update, 1000); 
}; 

// Call the recursive loop 
update(); 
}

唯一的区别是方法formatNum和它的四次调用：

formatNum(day); 
formatNum(hour); 
formatNum(minute); 
formatNum(second);

来源

2012-12-12 11:11:30

只要你应该添加前面零如果这个数小于10天，小时，第二...

day = day<10?'0' + day : day; 
hour = hour<10?'0' + hour : hour; 
second = second<10?'0' + second : second;

来源

2012-12-12 11:14:02

IMO，获得前导零的最简单的方法是使用substr：

var n = 10; 
console.log(('00' + n).substr(-2));//logs 10 
n = 2; 
console.log(('00' + n).substr(-2));//logs 02

容易 - peasy。如果你想把这个功能倒进去，返回一个字符串：

function addLeadingZeroes(n) 
{ 
    return ('00' + n).substr(-2); 
}

就是这样。

来源

2012-12-12 11:37:22

将前导零添加到此JavaScript倒计时脚本？

回答

相关问题