首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >如何在站点上实现实时和持久的数字计数器

如何在站点上实现实时和持久的数字计数器
EN

Stack Overflow用户
提问于 2011-02-03 04:34:55
回答 2查看 3.3K关注 0票数 3

我有个客户回收罐头。我们正在为他们开发一个新的网站,他们希望在他们的网站上有一个实时的“罐头加工”柜台。起始数(因为它们已经运行了一段时间)将在50,000,000左右,并且没有结束数。

为了得到“加工率”,我们可以平均出每年加工的罐头数量,并得到一个时间估计,如“每10秒1罐”。但是,我如何实现一个“持久”计数器,使计数器在页面加载/刷新时不会从设置值开始计时?

我是javascript和jQuery的初学者,但我确实理解编程概念和基础知识,而且我可以阅读脚本并弄清楚是怎么回事。如有任何想法或建议,我们将不胜感激。

EN

回答 2

Stack Overflow用户

回答已采纳

发布于 2011-02-03 04:46:11

以今年年初为例:

代码语言:javascript
运行
复制
var start = new Date(2011, 0, 1); // Note the 0!

计算已经过去了多少时间:

代码语言:javascript
运行
复制
var elapsed = new Date() - start; // In milliseconds

假设你的速率是每10秒1罐:

代码语言:javascript
运行
复制
var rate = 1 / 10 / 1000; // Cans per millisecond

计算自今年年初以来已处理的罐头数量:

代码语言:javascript
运行
复制
var cans = Math.floor(elapsed * rate);

因此,一个简单的设置可以是:

代码语言:javascript
运行
复制
var start = new Date(2011, 0, 1);
var rate = 1 / 10 / 1000;
var base = 50000000;

setInterval(function () {
    var cans = Math.floor((new Date() - start) * rate) + base;
    $("#cans").text(cans); // I hope you're using jQuery
}, 5000); // update every 5 seconds -- pick anything you like; won't affect result

http://jsfiddle.net/eKDXB/

一种优化可能是使您的更新间隔与已知速率保持一致,但可能更好的做法是使您的演示文稿更新与速率信息解耦。

票数 5
EN

Stack Overflow用户

发布于 2011-02-03 04:40:57

我想我会得到现在的时代

代码语言:javascript
运行
复制
var msecs = (new Date()).getTime();

然后用来计算罐头的数量

代码语言:javascript
运行
复制
var total_number = base_number + (msecs - start_date) / msecs_per_can;
票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/4879567

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档