JavaScript:数字计数器实时更新

javascript: number counter live updated

本文关键字:实时更新 计数器 数字 JavaScript      更新时间:2023-09-26

我正在寻找一种从给定日期开始每秒自动递增数字的方法,并且当我在页面上时,它必须实时更新。例如,我决定今天在 12.00.00 计数器将从 0 开始,然后它必须每秒更新一次(1 在 12.00.01,2 在 12.00.02 等等),我想看到数字在页面上实时变化。如果两个访问者在同一秒加载页面,他们将看到相同的数字,并且数字的增长将同步。我该怎么做?我对javascript很陌生,我发现了这个小提琴http://jsfiddle.net/dm6LL/5/

var amount = document.getElementById('amount');
var start = new Date("August 15, 2012 00:00:00").getTime();
var current;
update();
function update() {
var current = (new Date().getTime() - start)/1000*0.158+138276343;
amount.innerText = formatMoney(current);
}
setInterval(update,1000);
function formatMoney(amount) {
    var dollars = Math.floor(amount).toString().split('');
    var cents = (Math.round((amount%1)*100)/100).toString().split('.')[1];
if(typeof cents == 'undefined'){
    cents = '00';
}else if(cents.length == 1){
    cents = cents + '0';
}
var str = '';
for(i=dollars.length-1; i>=0; i--){
    str += dollars.splice(0,1);
    if(i%3 == 0 && i != 0) str += ',';
}
return '$' + str + '.' + cents;
}

这与我的目标相似,但它是用钱运行的,它并不是我所需要的。

你很接近。您所需要的只是对更新功能进行微小的更改。你可以跳过你的 formatMoney功能。

尝试这样的事情:

function update() {
    var oneDay = 24*60*60*1000; // hours*minutes*seconds*milliseconds
    var current = (new Date().getTime() - start);
    var diffDate = new Date(current);
    var days = Math.round(current/oneDay);
    amount.innerText = days + ":" + diffDate.getUTCHours() + ":" + diffDate.getUTCMinutes() + ":" + diffDate.getUTCSeconds();
}

基本上,它得到了开始和当前之间的差异,并将其放入amount而不是货币价值。

还有计算两个日期之间的天数oneDay

您可以根据需要格式化输出,但这应该可以让您开始。