javascript - 计算耗时并将其放入天数 :Hours:Minutes:Seconds format in javascript where time elapsed updates every second-6ren

javascript - 计算耗时并将其放入天数 :Hours:Minutes:Seconds format in javascript where time elapsed updates every second

转载作者：行者123 更新时间：2023-11-29 10:27:03

26

4

我正在尝试计算设定的日期时间对象和当前时间之间耗时。我希望它能够以这种格式出现 DD:HH:MM:SS 其中 DD 是天，HH 是小时，MM 是分钟，SS 是秒。我能够得到总天数、总小时数、总分钟数和总秒数，但我不确定如何按照我想要的方式对其进行格式化。请帮忙

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>timer</title>   
</head>
<body >
<div id ="time" name ="timer"></div>

<script>
var myVar = setInterval(myTimer, 1000);

function myTimer() {

  let seconds = 1000 ;
  let minutes = seconds * 60;
  let hours = minutes * 60;
  let days = hours * 24;
  let years = days * 365;


  const startDateTime = new Date("June 2, 2019 12:36:10 AM");
  const newDateTime = new Date();

  let timeDiff = newDateTime - startDateTime;

  let totalSeconds = Math.round(timeDiff/seconds);


  document.getElementById("time").innerHTML = totalSeconds;
}
</script>

</body>

</html>

最佳答案

我建议您使用类似 Moment.js 的库，但是如果您想在纯 Javascript 中执行此操作，您可以将总秒数除以您已经定义的除法参数，并在它们小于 10 时用零填充它们。

var myVar = setInterval(myTimer, 1000);

const seconds = 1000;
const minutes = seconds * 60;
const hours = minutes * 60;
const days = hours * 24;
const years = days * 365;

function myTimer() {
  const startDateTime = new Date("June 2, 2019 12:36:10 AM");
  const newDateTime = new Date();

  let elapsedMilliseconds = newDateTime - startDateTime;
  
  document.getElementById("time").innerHTML = 
  `${formatElapsedTime(elapsedMilliseconds, days)}:${formatElapsedTime(elapsedMilliseconds, hours, 24)}:${formatElapsedTime(elapsedMilliseconds, minutes, 60)}:${formatElapsedTime(elapsedMilliseconds, seconds, 60)}`;
}

function formatElapsedTime(elapsedtime, timeunit, base) {
  let time = base ? (elapsedtime / timeunit) % base : elapsedtime / timeunit;
  time = Math.floor(time);
  time = time < 10 ? '0' + time : time;
  return time;
}

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <title>timer</title>
</head>

<body>
  <div id="time" name="timer"></div>
</body>

</html>

关于javascript - 计算耗时并将其放入天数 :Hours:Minutes:Seconds format in javascript where time elapsed updates every second，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/56419249/

26

4

0

文章推荐： javascript - 如何在全新的空白页面中呈现 React Route 组件

文章推荐： javascript - 排序功能说明

c# - ElapsedTicks、ElapsedMilliseconds、Elapsed.Milliseconds 和 Elapsed.TotalMilliseconds 之间的区别？ (C#)
我对这 4 个完全困惑。ElapsedMilliseconds (long)、ElapsedTicks (long)、Elapsed.TotalMilliseconds (double) 和 Elap
c# timer.elapsed?
我已经包含了 System.Timers 包，但是当我输入时: Timer.Elapsed; //its not working, the property elapsed is just not t
c# - Timer Elapsed 事件如何与高优先级线程竞争？
我有一个要使用的 System.Timers.Timer 对象，但我不希望绑定(bind)到 Timer 的处理干扰普通到高优先级线程。换句话说，我想说我想每 5 秒处理一次 X，只要没有其他东西在运
c# - 告诉定时器对象异步调用它的 "Elapsed"事件
在我的应用程序中，有时我需要手动调用我的计时器。我试过以下方法: int originalInterval = t.Interval; t.Interval = 0; t.Interval = or
Javascript : Do Action after elapsed time
我有一个页面，我在其中触发 ajax 请求并在用户按下按钮后的前 6 秒内显示加载标志: var startTime=(new Date).getTime(); function
c# - 将不同的对象设置为 Timer.Elapsed
我想为每个对象分配不同的计时器。每个对象都包含 Timer 作为类成员。这就是我尝试过的: private void EntityTimeElapsed(object sender, MyEnti
C# Timer elapsed 在停止后仍然运行多一点
我正在使用 Windows 窗体。我正在使用 System.Timers.Timer 。虽然我用 timer.Stop() 停止了计时器，但它仍然会多一点。我放了一些 bool 变量来防止这种情况但没
labview - 如何获取使用 "Elapsed Time"组件复位后耗时？
我正在使用 LabVieW 计算电路的电容。我试图得到它两端的电压达到2.5V后的时间。我提供5V电源。我使用了逻辑运算符并将其连接到耗时组件的重置。但随着时间重置，我得到了零。我想知道实际耗时。电
java - 分而治之 : computing the time elapsed
我必须在大学做一个小作业: 我有一台运行“n”个独立服务的服务器。过去所有这些服务都是同时启动的。每个服务“i”都会在一定时间“s[i]”(以秒为单位)后将“b[i]”行写入服务器上的日志文件。输入由
c# - 包含带有计时器的对象的字典。需要找出哪个对象的定时器正在调用 elapsed 事件
我有这个投票类 class Poll { public string question { get; set; } public Timer pollTimer { get; set;
C# Timer on Elapsed Time 不调用方法
以下类来自 .Net Windows 服务。 DoSomeDatabaseStuff 方法在第一次启动时需要 10 分钟，但当时间过去后，不会再次调用此方法。 public class Test {
c# - Timer.Elapsed 触发事件只有一次，我想要每秒
Timers.Timer 来创建秒表。我使用 Timer.Elapsed 来处理在特定时间后显示时间的事件。我给定时器间隔 1 并启用为真。我还将 AutoReset 设置为 true。但问题是事件只
c# - 第一次引发 Elapsed 事件时进行测试。有效还是无用？
我有一个计时器，我想知道它是否有效以测试它是否是计时器第一次引发经过的事件(我想在第一次引发经过的事件后更改 Interval 属性) _timer = new Timer(1000)
c# - Timer Elapsed Event 不执行所有操作
我有一个 Backgroundworker，它从数据库中收集大量数据。我想在线程上设置一个超时限制，这样如果它在设定的时间后没有返回结果，进程就会被取消。我在启动 BackgroundWorker
c# - 秒表的 Elapsed Ticks 属性差异
ElapsedTicks & Elapsed.Ticks 是 Stopwatch 的属性，我觉得应该是一样的。如果它们相同，为什么它们应该给出不同的输出？代码: Stopwatch spwt = S
c# - 如何获取 Timer Elapsed 事件中发生的异常？
我正在使用 Windows 窗体应用程序并拥有一个使用 System.Timers.Timer 定期检查数据库数据的管理器类。如何将计时器 Elapsed 事件处理程序中发生的异常传递给主应用程序？
c# - 如何立即触发 timer.Elapsed 事件
我正在使用 System.Timers.Timer 类创建一个带有 Timer.Elapsed 事件的计时器。问题是 Timer.Elapsed 事件仅在间隔时间过去后才第一次触发。有没有办法在启动
javascript - 网络音频API : frequency related to elapsed time
我有一个获取音频的脚本。我想将该频率与歌曲的确切时间联系起来。我可以获取 webkitAudioContext currentTime 属性，但这并不准确，因为它在歌曲开始之前将声音保存在缓冲区中时开
java - Jav8 : Computing Elapsed time for Timestamp
我有下面的代码来获取当前时间戳并计算最后时间戳的耗时(以分钟为单位)，我想知道是否可以进一步针对生产进行优化 public static Timestamp getTimestamp() {
java - 在 Mono 上使用 elapsed() 函数可以吗？
我正在尝试获取在响应式(Reactive)编程中从 Redis 读取数据的执行时间，在查找文档时我可以看到 elapsed() 方法将执行相同的操作并实现如下代码。 Flux.fromIterable

首页

博学

6Ren·AI

商城

javascript - 计算耗时并将其放入天数 :Hours:Minutes:Seconds format in javascript where time elapsed updates every second