Find elapsed time in javascript
我是JavaScript的新手,我正在尝试编写一个代码,用于计算从用户登录到当前时间所经过的时间。
这是我的代码: -
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 | function markPresent() { window.markDate = new Date(); $(document).ready(function() { $("div.absent").toggleClass("present"); }); updateClock(); } function updateClock() { var markMinutes = markDate.getMinutes(); var markSeconds = markDate.getSeconds(); var currDate = new Date(); var currMinutes = currDate.getMinutes(); var currSeconds = currDate.getSeconds(); var minutes = currMinutes - markMinutes; if(minutes < 0) { minutes += 60; } var seconds = currSeconds - markSeconds; if(seconds < 0) { seconds += 60; } if(minutes < 10) { minutes ="0" + minutes; } if(seconds < 10) { seconds ="0" + seconds; } var hours = 0; if(minutes == 59 && seconds == 59) { hours++; } if(hours < 10) { hours ="0" + hours; } var timeElapsed = hours+':'+minutes+':'+seconds; document.getElementById("timer").innerHTML = timeElapsed; setTimeout(function() {updateClock()}, 1000); } |
输出正确到00:59:59,但之后O / P是:
0时59分59秒
1时59分59秒
1点59分00秒
1时59分01秒
。
。
。
。
1时59分59秒
01:00:00
我怎样才能解决这个问题,是否有更有效的方法可以做到这一点?
谢谢。
没有冒犯,但这是大量过度引擎。只需存储脚本首次运行时的开始时间,然后在每次计时器触发时从当前时间中减去该开始时间。
有很多关于将ms转换为可读时间戳的教程,因此这里不需要介绍。
1 2 3 4 5 6 7 | var start = Date.now(); setInterval(function() { document.getElementById('difference').innerHTML = Date.now() - start; // the difference will be in ms }, 1000); |
1 |
这里发生了太多事情。
一种更简单的方法就是每次将
参见演示:http://jsfiddle.net/7e4psrzu/
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 | function markPresent() { window.markDate = new Date(); $(document).ready(function() { $("div.absent").toggleClass("present"); }); updateClock(); } function updateClock() { var currDate = new Date(); var diff = currDate - markDate; document.getElementById("timer").innerHTML = format(diff/1000); setTimeout(function() {updateClock()}, 1000); } function format(seconds) { var numhours = parseInt(Math.floor(((seconds % 31536000) % 86400) / 3600),10); var numminutes = parseInt(Math.floor((((seconds % 31536000) % 86400) % 3600) / 60),10); var numseconds = parseInt((((seconds % 31536000) % 86400) % 3600) % 60,10); return ((numhours<10) ?"0" + numhours : numhours) +":" + ((numminutes<10) ?"0" + numminutes : numminutes) +":" + ((numseconds<10) ?"0" + numseconds : numseconds); } markPresent(); |
1 | <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"> |
这是我刚为我的用例制作的解决方案。我觉得它很可读。基本前提是简单地从当前时间戳中减去时间戳,然后将其除以正确的单位:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 | const showElapsedTime = (timestamp) => { if (typeof timestamp !== 'number') return 'NaN' const SECOND = 1000 const MINUTE = 1000 * 60 const HOUR = 1000 * 60 * 60 const DAY = 1000 * 60 * 60 * 24 const MONTH = 1000 * 60 * 60 * 24 * 30 const YEAR = 1000 * 60 * 60 * 24 * 30 * 12 // const elapsed = ((new Date()).valueOf() - timestamp) const elapsed = 1541309742360 - timestamp if (elapsed <= MINUTE) return `${Math.round(elapsed / SECOND)}s` if (elapsed <= HOUR) return `${Math.round(elapsed / MINUTE)}m` if (elapsed <= DAY) return `${Math.round(elapsed / HOUR)}h` if (elapsed <= MONTH) return `${Math.round(elapsed / DAY)}d` if (elapsed <= YEAR) return `${Math.round(elapsed / MONTH)}mo` return `${Math.round(elapsed / YEAR)}y` } const createdAt = 1541301301000 console.log(showElapsedTime(createdAt + 5000000)) console.log(showElapsedTime(createdAt)) console.log(showElapsedTime(createdAt - 500000000)) |
例如,如果经过了3000毫秒,则3000大于
如果您需要以秒为单位而不是毫秒的时间戳,请将
以下是更干燥形式的缩放单位:
1 2 3 4 5 6 | const SECOND = 1000 const MINUTE = SECOND * 60 const HOUR = MINUTE * 60 const DAY = HOUR * 24 const MONTH = DAY * 30 const YEAR = MONTH * 12 |
你可以简单地使用performance.now()
例:
1 2 3 | start = performance.now(); elapsedTime = performance.now() - start; |
我发现有用的是C ++构造的'端口'(尽管通常在C ++中我离开
1 2 3 4 5 6 7 8 | var trace = console.log function elapsed(op) { this.op = op this.t0 = Date.now() } elapsed.prototype.show = function() { trace.apply(null, [this.op, 'msec', Date.now() - this.t0, ':'].concat(Array.from(arguments))) } |
使用 - 例如:
1 2 3 4 5 | function debug_counters() { const e = new elapsed('debug_counters') const to_show = visibleProducts().length e.show('to_show', to_show) } |
我知道这是一个很老的问题但是我想要自己解决方案以防万一有人希望有一个JS封装的插件。理想情况下我会:启动,暂停,恢复,停止,重置方法。提供以下代码可以很容易地添加所有提到的代码。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 | (function(w){ var timeStart, timeEnd, started = false, startTimer = function (){ this.timeStart = new Date(); this.started = true; }, getPartial = function (end) { if (!this.started) return 0; else { if (end) this.started = false; this.timeEnd = new Date(); return (this.timeEnd - this.timeStart) / 1000; } }, stopTime = function () { if (!this.started) return 0; else { return this.getPartial(true); } }, restartTimer = function(){ this.timeStart = new Date(); }; w.Timer = { start : startTimer, getPartial : getPartial, stopTime : stopTime, restart : restartTimer }; })(this); |
1 2 3 4 | Start Partial Stop Restart |
我会使用
1 2 3 4 5 6 7 | var hours = 0; if(minutes == 59 && seconds == 59) { hours = hours + 1; minutes = '00'; seconds == '00'; } |