4

我想要完成的是实时更新的倒计时......像这样：

6天（只是几天）

12 小时（1 天内仅数小时）

59 分钟（1 小时内仅几分钟）

59 秒（仅 1 分钟内的秒数）

实现这一目标的最佳方法？

4

6 回答 6

13

您可以在http://jsfiddle.net/gaby/QH6X8/79/找到一个工作示例

var end = new Date('15 Dec 2010');

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 ) {
       // handle expiry here..
       clearInterval( timer ); // stop the timer from continuing ..
       alert('Expired'); // alert a message that the timer has expired..
    }
    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 );

    var countdownElement = document.getElementById('countdown');
    countdownElement.innerHTML = 'Days: ' + days + '<br />';
    countdownElement.innerHTML += 'Hours: ' + hours+ '<br />';
    countdownElement.innerHTML += 'Minutes: ' + minutes+ '<br />';
    countdownElement.innerHTML += 'Seconds: ' + seconds+ '<br />';
}

timer = setInterval(showRemaining, 1000);
于 2010-11-10T23:44:23.523 回答
3

jQuery 倒计时插件

于 2010-11-10T23:30:29.483 回答
0

上述公认方法的问题在于，这里会出现与时区差异和夏令时相关的问题。请参阅我提出的这个问题Javascript Countdown and Timezone and Daylight Saving Time Issues

于 2012-07-27T13:40:47.397 回答
0

值得注意的是：http ://www.littlewebthings.com/projects/countdown/ （可能无关紧要，因为您提到您不想使用插件）

于 2010-11-11T18:03:41.817 回答
0

jCounter提供对您希望倒计时显示的格式以及其他控制设置和方法的控制。

于 2012-09-29T17:25:26.697 回答
0

如果您愿意，您可以在这里生成倒数计时器 - 只需按生成并将结果复制粘贴到 .html 文件中

http://www.ricocheting.com/code/javascript/html-generator/countdown-timer

于 2010-11-10T23:41:15.873 回答