如何在moment.js中将秒转换为HH:mm:ss


93

如何将秒转换为 HH:mm:ss

目前,我正在使用以下功能

render: function (data){
     return new Date(data*1000).toTimeString().replace(/.*(\d{2}:\d{2}:\d{2}).*/, "$1");;
}

这适用于chrome,但是在Firefox中12秒钟我得到了01:00:12 我想使用moment.js来实现跨浏览器兼容性

我尝试了这个但没有用

render: function (data){
         return moment(data).format('HH:mm:ss');
}

我究竟做错了什么?

编辑

我设法找到没有 moment.js 的解决方案,如下

return (new Date(data * 1000)).toUTCString().match(/(\d\d:\d\d:\d\d)/)[0];

仍然对我如何在moment.js中做到这一点感到好奇



@mplungjan对不起,我没有提到我已经阅读了该帖子。我需要渲染一个包含数百万行的表,并且解决方案太慢了。第二个答案正是我在问题中所写的内容,但给我带来了Firefox的问题
QGA 2015年

2
@QuentinTanioartino因此,对于将DOM数百万个元素变异的任务而言,这4个琐碎的数学运算符是一个问题吗?您确定您正确理解性能问题吗?
zerkms 2015年

@zerkms好,我知道我的DAO类必须重写才能提供已经转换的数据。我知道这是一个问题。说我对第一次尝试的当前性能感到非常满意,但是当我进行5次数学运算以进行转换时,这会稍微降低系统的速度。是的,我同意您的意见,这只是一种快速的临时解决方案
QGA 2015年

@QuentinTanioartino“这会稍微降低系统速度” ---“一点”并不是您对性能的看法。是瓶颈吗?被证明是瓶颈吗?如果不是-是什么促使您优化此操作?
zerkms 2015年

Answers:


78

这篇文章中,我将尝试这样做以避免出现跳跃问题

moment("2015-01-01").startOf('day')
    .seconds(s)
    .format('H:mm:ss');

我没有运行jsPerf,但是我认为这比创建新日期对象一百万次要快

function pad(num) {
    return ("0"+num).slice(-2);
}
function hhmmss(secs) {
  var minutes = Math.floor(secs / 60);
  secs = secs%60;
  var hours = Math.floor(minutes/60)
  minutes = minutes%60;
  return `${pad(hours)}:${pad(minutes)}:${pad(secs)}`;
  // return pad(hours)+":"+pad(minutes)+":"+pad(secs); for old browsers
}


2
非常感谢您,非常聪明的解决方案
QGA 2015年

1
第二个,它非常快
QGA 2015年

1
您可以在第二个示例中执行此操作:return [hours,minutes,seconds] .filter(t => t).map(pad).join(“:”)
Onno Faber

@OnnoFaber您认为最快的是什么?串联还是过滤器再加上地图?我们也可以这样做`${pad(hours)}:${pad(minutes)}:${pad(secs)}`
mplungjan

从以前的所有答案中,最简单的是mplungjan之一,但是如果该值具有毫秒(例如:17.3 s),则会显示错误,显示随机数。根据他的代码,我提出以下建议:function pad(num){return(“ 0” + num).slice(-2); } / ** * @return {string} * /导出默认函数renderUserTime(seconds){let minutes = Math.floor(seconds / 60); const outputSecs = Math.round(seconds%60); 让小时= Math.floor(分钟/ 60); const outputMinutes = Math.round(minutes%60); return`$ {pad(hours)}:$ {pad(outputMi
Alberto Soto,

94

这类似于另一篇文章中引用的mplungjan的答案,但更为简洁:

const secs = 456;

const formatted = moment.utc(secs*1000).format('HH:mm:ss');

document.write(formatted);
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.min.js"></script>

它遭受同样的警告,例如,如果秒数超过一天(86400),您将无法获得期望的结果。


1
谢谢,我认为这是一个非常普遍的需求,请向moment.js打开请求请求,他们应该将其合并。
莫里斯S

谢谢@索菲。很少有人提到utc(),这正是我所需要的。
pmont

24

您可以使用moment-duration-format插件:

var seconds = 3820;
var duration = moment.duration(seconds, 'seconds');
var formatted = duration.format("hh:mm:ss");
console.log(formatted); // 01:03:40
<!-- Moment.js library -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.min.js"></script>

<!-- moment-duration-format plugin -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment-duration-format/1.3.0/moment-duration-format.min.js"></script>

另请参阅此小提琴

更新:为避免调整小于60秒的值,请使用{ trim: false }

var formatted = duration.format("hh:mm:ss", { trim: false }); // "00:00:05"

需要权衡您的答案和@sophie的答案。从技术上讲,您的解决方案将以“ hh:mm:ss”显示“ Time”的持续时间,但它需要额外的插件。Sophie's是当前时间点的“日期”,格式为hh:mm:ss。如果您从Sophie的网站中删除了“ utc”,则它可能返回错误的信息,因为它使用纪元作为日期而不是当前时间。两种答案都有效。只是需要考虑和理解的东西。
迈克尔(Michael

虽然在这里使用CDN会增加等待时间,但通常认为将“包括另一个库”视为不利的权衡,而不是自己执行代码。我看到这是一个陷阱,许多开发人员都陷入其中,并最终使用了较少维护的代码。
cytinus

由于某些原因,如果秒数<60,那么它最终会以未格式化的格式结束
Daniel Lizik,

@DanielLizik,只需添加{trim:false}。例如:duration.format(“ hh:mm:ss”,{trim:false});
Oleksiy Kachynskyy

16
var seconds = 2000 ; // or "2000"
seconds = parseInt(seconds) //because moment js dont know to handle number in string format
var format =  Math.floor(moment.duration(seconds,'seconds').asHours()) + ':' + moment.duration(seconds,'seconds').minutes() + ':' + moment.duration(seconds,'seconds').seconds();

1

如何正确使用moment.js持续时间? | 在代码中使用moment.duration()

首先,您需要导入momentmoment-duration-format

import moment from 'moment';
import 'moment-duration-format';

然后,使用持续时间功能。让我们应用上面的示例:28800 = 8 am。

moment.duration(28800, "seconds").format("h:mm a");

🎉好,您没有上述类型错误。您在8:00上午获得正确的值吗?不,您获得的价值是8:00。Moment.js格式无法正常运行。

💡解决方案是将秒转换为毫秒,并使用UTC时间。

moment.utc(moment.duration(value, 'seconds').asMilliseconds()).format('h:mm a')

好吧,我们现在早上8:00。如果您希望上午8点而不是上午8:00积分,我们需要进行RegExp

const time = moment.utc(moment.duration(value, 'seconds').asMilliseconds()).format('h:mm a');
time.replace(/:00/g, '')

1

直到24小时。由于Duration.format已被弃用,与moment@2.23.0

const seconds = 123;
moment.utc(moment.duration(seconds,'seconds').as('milliseconds')).format('HH:mm:ss');
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.