JavaScript秒以时间格式设置为hh:mm:ss的字符串


300

我想将持续时间(即秒数)转换为以冒号分隔的时间字符串(hh:mm:ss)

我在这里找到了一些有用的答案,但他们都谈论转换为x小时和x分钟格式。

那么,有没有一个小片段在jQuery或原始JavaScript中做到这一点?


11
此线程中一些建议答案的基准。jsperf.com/ms-to-hh-mm-ss-time-format
Claudijo 2013年

Answers:


582
String.prototype.toHHMMSS = function () {
    var sec_num = parseInt(this, 10); // don't forget the second param
    var hours   = Math.floor(sec_num / 3600);
    var minutes = Math.floor((sec_num - (hours * 3600)) / 60);
    var seconds = sec_num - (hours * 3600) - (minutes * 60);

    if (hours   < 10) {hours   = "0"+hours;}
    if (minutes < 10) {minutes = "0"+minutes;}
    if (seconds < 10) {seconds = "0"+seconds;}
    return hours+':'+minutes+':'+seconds;
}

您现在可以像这样使用它:

alert("5678".toHHMMSS());

工作片段:


1
感谢原型的想法,我喜欢如何称呼它。我为Number制作了原型,因此也可以在其上调用它。我还发现此答案可以删除不需要的小时和分钟。
alunsford3 2012年

21
使用“%”运算符>> var分钟= Math.floor((sec_num%3600)/ 60); var seconds = Math.floor(sec_num%60);
IvanM 2014年

3
啊,谢谢。在您对整数调用.toString()之前,我认为它不能同时作为字符串工作。你可以把它解决的其他方式通过解析INT太
索尼克的灵魂

51
不要放在原型上,只需创建一个实用函数即可。
Michael J. Calkins,2015年

15
修改这种东西的原型?390个赞?认真吗?
卢卡斯·里西斯

196

您可以借助JS Date方法,而无需任何外部JS库来完成此操作,如下所示:

var date = new Date(0);
date.setSeconds(45); // specify value for SECONDS here
var timeString = date.toISOString().substr(11, 8);
console.log(timeString)


4
为什么这个答案这么低?我在2011年得到它,可能是IE 7和8是不支持它的基础,但是到2014年底,所以这个简单,简单,免费的解决方案应该更高。
埃米尔·博尔科尼

2
从MDN:如果您指定的参数超出预期范围,则setSeconds()尝试相应地更新Date对象中的日期信息。例如,如果您对secondsValue使用100,则Date对象中存储的分钟将增加1,而40将用于秒。是的,看起来不错!
安德鲁

40
我喜欢这个答案。甚至可以更短:new Date(1000 * seconds).toISOString().substr(11, 8)
Bohumir Zamecnik

4
好答案。您可以使用.replace(/^[0:]+/, "")after 从字符串开头substr删除所有零:
Palo

1
将此添加到前面可以处理超过24小时的时间。parseInt(d / 86400)+“ d”
Tofandel

82

要获取格式中的时间部分hh:MM:ss,可以使用以下正则表达式:

(上面有人在同一篇文章中提到了这一点,谢谢。)

    var myDate = new Date().toTimeString().replace(/.*(\d{2}:\d{2}:\d{2}).*/, "$1");
    console.log(myDate)


8
+1-超简单;谢谢!只是使用了这种形式的变体而仅显示分钟和秒:var myDate = new Date().toTimeString().replace(/.*(\d{2}:\d{2})(:\d{2}).*/, "$1");
Topher Fangio

1
不应为“ new Date(null,null,null,null,null,timeInSecs).toTimeString()。replace(/.*(\ d {2}:)(\ d {2}:\ d {2 })。* /,“ $ 2”)“?
obie

6
的使用replace令人困惑。为什么不使用new Date(null, null, null, null, null, timeInSeconds).toTimeString().match(/\d{2}:\d{2}:\d{2}/)[0]
克林Darie

4
这对于显示给定时间是很好的,但是请注意,问题(以及此处的其他答案)是关于显示持续时间,即与当前时间无关的给定秒数。
mahemoff 2014年

4
更简单的版本:new Date().toTimeString().split(" ")[0]
Henrik N

52

我建议使用Date对象使用普通的javascript:

var seconds = 9999;
// multiply by 1000 because Date() requires miliseconds
var date = new Date(seconds * 1000);
var hh = date.getUTCHours();
var mm = date.getUTCMinutes();
var ss = date.getSeconds();
// If you were building a timestamp instead of a duration, you would uncomment the following line to get 12-hour (not 24) time
// if (hh > 12) {hh = hh % 12;}
// These lines ensure you have two-digits
if (hh < 10) {hh = "0"+hh;}
if (mm < 10) {mm = "0"+mm;}
if (ss < 10) {ss = "0"+ss;}
// This formats your string to HH:MM:SS
var t = hh+":"+mm+":"+ss;
document.write(t);

(当然,创建的Date对象将具有与之关联的实际日期,但是该数据是多余的,因此出于这些目的,您不必担心它。)


看来是在当地时区进行日期,在我的情况下,这会增加1个小时的时间。使用seconds = 0,我得到“ 01:00:00”(1970年1月1日,星期四,格林尼治标准时间+0100(CET)),这是错误的。
mivk 2013年

3
如果使用date.getUTCHours()和我会得到正确的结果date.getUTCMinutes()
mivk

我不明白为什么他要求持续时间时为什么要返回12小时的时间戳?
内森·特雷施

@JellicleCat更改为+1,并且名字很漂亮。
内森·特雷施

1
我喜欢这个,但它确实假设持续时间少于24小时
罗里(Rory)

40

Google搜索显示了以下结果

function secondsToTime(secs)
{
    secs = Math.round(secs);
    var hours = Math.floor(secs / (60 * 60));

    var divisor_for_minutes = secs % (60 * 60);
    var minutes = Math.floor(divisor_for_minutes / 60);

    var divisor_for_seconds = divisor_for_minutes % 60;
    var seconds = Math.ceil(divisor_for_seconds);

    var obj = {
        "h": hours,
        "m": minutes,
        "s": seconds
    };
    return obj;
}

8
secondsToTime(119.9)=> Object {h: 0, m: 1, s: 60}。要解决此问题,请secs = Math.round(secs);在方法开始处添加。当然,我们在演示过程中看到了此错误...
Benjamin Crouzier

29

主题变化。处理单位数秒有些不同

seconds2time(0)  ->  "0s" 
seconds2time(59) -> "59s" 
seconds2time(60) -> "1:00" 
seconds2time(1000) -> "16:40" 
seconds2time(4000) -> "1:06:40"

function seconds2time (seconds) {
    var hours   = Math.floor(seconds / 3600);
    var minutes = Math.floor((seconds - (hours * 3600)) / 60);
    var seconds = seconds - (hours * 3600) - (minutes * 60);
    var time = "";

    if (hours != 0) {
      time = hours+":";
    }
    if (minutes != 0 || time !== "") {
      minutes = (minutes < 10 && time !== "") ? "0"+minutes : String(minutes);
      time += minutes+":";
    }
    if (time === "") {
      time = seconds+"s";
    }
    else {
      time += (seconds < 10) ? "0"+seconds : String(seconds);
    }
    return time;
}

感谢您为我节省一个小时的时间
starsinmypockets 2013年

29

这是我的看法:

function formatTime(seconds) {
  const h = Math.floor(seconds / 3600);
  const m = Math.floor((seconds % 3600) / 60);
  const s = Math.round(seconds % 60);
  return [
    h,
    m > 9 ? m : (h ? '0' + m : m || '0'),
    s > 9 ? s : '0' + s
  ].filter(Boolean).join(':');
}

预期成绩:

const expect = require('expect');
expect(formatTime(0)).toEqual('0:00');
expect(formatTime(1)).toEqual('0:01');
expect(formatTime(599)).toEqual('9:59');
expect(formatTime(600)).toEqual('10:00');
expect(formatTime(3600)).toEqual('1:00:00');
expect(formatTime(360009)).toEqual('100:00:09');
expect(formatTime(0.2)).toEqual('0:00');

您可以这样写: const formatTime = (seconds, h = Math.floor(seconds / 3600), m = Math.floor((seconds % 3600) / 60), s = seconds % 60) => [h, m > 9 ? m : '0' + m, s > 9 ? s : '0' + s].filter(s => s).join(':');
Ruben Stolk

2
@RubenStolk我发现让一个带有两个second参数的函数有点令人困惑。我发现我的版本更加清晰,即使它有些冗长。
汤姆·埃斯特雷斯

seconds: number在es6中输入注释?
Olian04年

1
自IE9开始支持@pstanton尾部逗号:caniuse.com/#feat=mdn-javascript_grammar_trailing_commas。我个人现在选择忽略那些旧的浏览器。但是您是对的,我删除了它,因此答案更加通用。
Tom Esterez

1
很好的解决方案。也许只是将秒更改为const s = Math.round(seconds % 60);
拉夫

16

我喜欢第一个答案。有一些优化:

  • 源数据是一个数字。不需要额外的计算。

  • 大量多余的计算

结果代码:

Number.prototype.toHHMMSS = function () {
    var seconds = Math.floor(this),
        hours = Math.floor(seconds / 3600);
    seconds -= hours*3600;
    var minutes = Math.floor(seconds / 60);
    seconds -= minutes*60;

    if (hours   < 10) {hours   = "0"+hours;}
    if (minutes < 10) {minutes = "0"+minutes;}
    if (seconds < 10) {seconds = "0"+seconds;}
    return hours+':'+minutes+':'+seconds;
}

1
我认为此函数是前面使用的功能,因此我原型为String而不是Number。而且Number始终可以是字符串,但不能相反。
powtac

3
我认为Number是正确的,因为seconds实际上是一个数字。您应该在使用此函数之前从字符串转换,这是正确的选择!
caesarsol 2013年

2
像这个一样,被否决的答案是不好的。我敢打赌,您不需要所有数字都可以使用此方法。不要为随机实用程序内容修改原型。
卢卡斯·里西斯

或只是原型并使其成为函数numToHHMMSS或strTOHHMMSS
yeahdixon19'1

此解决方案有效,而选定的解决方案为某些值生成60秒。
AndroidDev

14

使用惊人的moment.js库:

function humanizeDuration(input, units ) { 
  // units is a string with possible values of y, M, w, d, h, m, s, ms
  var duration = moment().startOf('day').add(units, input),
    format = "";

  if(duration.hour() > 0){ format += "H [hours] "; }

  if(duration.minute() > 0){ format += "m [minutes] "; }

  format += " s [seconds]";

  return duration.format(format);
}

这使您可以指定任何持续时间,包括小时,分钟,秒,毫秒,并返回人类可读的版本。


14
function formatTime(seconds) {
    return [
        parseInt(seconds / 60 / 60),
        parseInt(seconds / 60 % 60),
        parseInt(seconds % 60)
    ]
        .join(":")
        .replace(/\b(\d)\b/g, "0$1")
}

关于此答案为何对发问者有用或原始问题中可能有什么问题的进一步解释将有助于提高此答案的质量。
Josh Burgess

1
漂亮的自我解释和良好答案,减少和简化了最佳答案。
AlexioVay

精确答案
:)

11

new Date().toString().split(" ")[4];

结果 15:08:03


很好-谢谢!我为我的需求做了一个小的提高是一个持续时间以毫秒为单位转换为HH:MM:SS - new Date(new Date().getTime() - startTime).toUTCString().split(" ")[4]这里startTime以前设置使用startTime = new Date().getTime();。(我不得不使用,toUTCString()因为否则会花费一个小时。)
理查德·怀斯曼

10

很简单

function toTimeString(seconds) {
  return (new Date(seconds * 1000)).toUTCString().match(/(\d\d:\d\d:\d\d)/)[0];
}

这仅在您的持续时间少于1天时有效。但除此之外,还不错。
cjbarth 2015年

8
s2t=function (t){
  return parseInt(t/86400)+'d '+(new Date(t%86400*1000)).toUTCString().replace(/.*(\d{2}):(\d{2}):(\d{2}).*/, "$1h $2m $3s");
}

s2t(123456);

结果:

1d 10h 17m 36s

6

我最喜欢Webjins的答案,因此我将其扩展为带广告后缀的显示天数,使显示成为有条件的,并在普通秒后作为后缀包括在内:

function sec2str(t){
    var d = Math.floor(t/86400),
        h = ('0'+Math.floor(t/3600) % 24).slice(-2),
        m = ('0'+Math.floor(t/60)%60).slice(-2),
        s = ('0' + t % 60).slice(-2);
    return (d>0?d+'d ':'')+(h>0?h+':':'')+(m>0?m+':':'')+(t>60?s:s+'s');
}

返回“ 3d 16:32:12”或“ 16:32:12”或“ 32:12”或“ 12s”


这将是不正确的,持续时间为24天或更长时间
查理·马丁

为什么要比较大于0的字符串?
吉米·凯恩'18

@JimmyKane因为自动类型转换-我喜欢它!(加上:代码更易于阅读(出于某种原因,您进行了类型转换,但让我们停止拖延(我们俩))。加:仅当t为NaN时函数才会失败-因此,如果需要安全性:它在输入上!)
21:21

@nïkö好,我知道,但是更严格的新JS版本,短绒棉等可能会抱怨这一点。只是说,误会我的意思。我喜欢您的回答
Jimmy Kane

6

我喜欢Powtac的答案,但是我想在angular.js中使用它,因此我使用他的代码创建了一个过滤器。

.filter('HHMMSS', ['$filter', function ($filter) {
    return function (input, decimals) {
        var sec_num = parseInt(input, 10),
            decimal = parseFloat(input) - sec_num,
            hours   = Math.floor(sec_num / 3600),
            minutes = Math.floor((sec_num - (hours * 3600)) / 60),
            seconds = sec_num - (hours * 3600) - (minutes * 60);

        if (hours   < 10) {hours   = "0"+hours;}
        if (minutes < 10) {minutes = "0"+minutes;}
        if (seconds < 10) {seconds = "0"+seconds;}
        var time    = hours+':'+minutes+':'+seconds;
        if (decimals > 0) {
            time += '.' + $filter('number')(decimal, decimals).substr(2);
        }
        return time;
    };
}])

它在功能上是相同的,除了我添加了一个可选的小数字段以显示小数秒。像使用其他任何过滤器一样使用它:

{{ elapsedTime | HHMMSS }} 显示: 01:23:45

{{ elapsedTime | HHMMSS : 3 }} 显示: 01:23:45.678


我有两个datetime对象,并且我想计算这2个datetime对象的差值,并以这种格式返回输出:小时:分钟:秒为两位数的秒,例如:01:02:45。请您告诉我还是少指导我与您的代码?
学习过度思想迷惑,2016年

4

我认为这是迄今为止性能最快的:

var t = 34236; // your seconds
var time = ('0'+Math.floor(t/3600) % 24).slice(-2)+':'+('0'+Math.floor(t/60)%60).slice(-2)+':'+('0' + t % 60).slice(-2)
//would output: 09:30:36

非常棒。恭喜!
布伦纳·费雷拉

很好...并且> 24小时安全。
Jeffz

4
function toHHMMSS(seconds) {
    var h, m, s, result='';
    // HOURs
    h = Math.floor(seconds/3600);
    seconds -= h*3600;
    if(h){
        result = h<10 ? '0'+h+':' : h+':';
    }
    // MINUTEs
    m = Math.floor(seconds/60);
    seconds -= m*60;
    result += m<10 ? '0'+m+':' : m+':';
    // SECONDs
    s=seconds%60;
    result += s<10 ? '0'+s : s;
    return result;
}

例子

    toHHMMSS(111); 
    “ 01:51”

    toHHMMSS(4444);
    “ 01:14:04”

    toHHMMSS(33);
    “ 00:33”

我也会加上Math.floor()秒,因为它们可能以小数表示。(发生在我身上。)

3

这是另一个版本,也可以处理几天:

function FormatSecondsAsDurationString( seconds )
{
    var s = "";

    var days = Math.floor( ( seconds / 3600 ) / 24 );
    if ( days >= 1 )
    {
        s += days.toString() + " day" + ( ( days == 1 ) ? "" : "s" ) + " + ";
        seconds -= days * 24 * 3600;
    }

    var hours = Math.floor( seconds / 3600 );
    s += GetPaddedIntString( hours.toString(), 2 ) + ":";
    seconds -= hours * 3600;

    var minutes = Math.floor( seconds / 60 );
    s += GetPaddedIntString( minutes.toString(), 2 ) + ":";
    seconds -= minutes * 60;

    s += GetPaddedIntString( Math.floor( seconds ).toString(), 2 );

    return s;
}

function GetPaddedIntString( n, numDigits )
{
    var nPadded = n;
    for ( ; nPadded.length < numDigits ; )
    {
        nPadded = "0" + nPadded;
    }

    return nPadded;
}

3

可使用正则表达式匹配从toString()Date对象的方法返回的字符串中的时间子字符串,其格式如下:“ 2012年7月5日星期四02:45:12 GMT + 0100(GMT夏令时)”。请注意,此解决方案使用的时间是从1970年1月1日午夜开始的。该解决方案可以是单行的,尽管将其拆分起来更容易理解。

function secondsToTime(seconds) {
    const start = new Date(1970, 1, 1, 0, 0, 0, 0).getTime();
    const end = new Date(1970, 1, 1, 0, 0, parseInt(seconds), 0).getTime();
    const duration = end - start;

    return new Date(duration).toString().replace(/.*(\d{2}:\d{2}:\d{2}).*/, "$1");
}

2

这是我的方法。它看起来工作得很好,并且非常紧凑。(不过,它使用了很多三元运算符)

function formatTime(seconds) {
  var hh = Math.floor(seconds / 3600),
    mm = Math.floor(seconds / 60) % 60,
    ss = Math.floor(seconds) % 60;
  return (hh ? (hh < 10 ? "0" : "") + hh + ":" : "") + ((mm < 10) && hh ? "0" : "") + mm + ":" + (ss < 10 ? "0" : "") + ss
}

...以及格式化字符串...

String.prototype.toHHMMSS = function() {
  formatTime(parseInt(this, 10))
};

2

您可以使用以下函数将时间(以秒为单位)转换为HH:MM:SS格式:

var convertTime = function (input, separator) {
    var pad = function(input) {return input < 10 ? "0" + input : input;};
    return [
        pad(Math.floor(input / 3600)),
        pad(Math.floor(input % 3600 / 60)),
        pad(Math.floor(input % 60)),
    ].join(typeof separator !== 'undefined' ?  separator : ':' );
}

在不传递分隔符的情况下,它:用作(默认)分隔符:

time = convertTime(13551.9941351); // --> OUTPUT = 03:45:51

如果要-用作分隔符,只需将其作为第二个参数传递:

time = convertTime(1126.5135155, '-'); // --> OUTPUT = 00-18-46

演示版

var convertTime = function (input, separator) {
    var pad = function(input) {return input < 10 ? "0" + input : input;};
    return [
        pad(Math.floor(input / 3600)),
        pad(Math.floor(input % 3600 / 60)),
        pad(Math.floor(input % 60)),
    ].join(typeof separator !== 'undefined' ?  separator : ':' );
}

document.body.innerHTML = '<pre>' + JSON.stringify({
    5.3515555 : convertTime(5.3515555),
    126.2344452 : convertTime(126.2344452, '-'),
    1156.1535548 : convertTime(1156.1535548, '.'),
    9178.1351559 : convertTime(9178.1351559, ':'),
    13555.3515135 : convertTime(13555.3515135, ',')
}, null, '\t') +  '</pre>';

另请参阅此Fiddle



1

这是我做的

function timeFromSecs(seconds)
{
    return(
    Math.floor(seconds/86400)+'d :'+
    Math.floor(((seconds/86400)%1)*24)+'h : '+
    Math.floor(((seconds/3600)%1)*60)+'m : '+
    Math.round(((seconds/60)%1)*60)+'s');
}

timeFromSecs(22341938)将返回'258d 14h 5m 38s'


1

我个人更喜欢无前导零的前导单位(天,小时,分钟)。但是秒总是以分钟(0:13)开头,此演示文稿很容易被视为“持续时间”,无需进一步说明(标记为min,sec(s)等),可以在多种语言中使用(国际化)。

    // returns  (-)d.h:mm:ss(.f)
    //          (-)h:mm:ss(.f)
    //          (-)m:ss(.f)
    function formatSeconds (value, fracDigits) {
        var isNegative = false;
        if (isNaN(value)) {
            return value;
        } else if (value < 0) {
            isNegative = true;
            value = Math.abs(value);
        }
        var days = Math.floor(value / 86400);
        value %= 86400;
        var hours = Math.floor(value / 3600);
        value %= 3600;
        var minutes = Math.floor(value / 60);
        var seconds = (value % 60).toFixed(fracDigits || 0);
        if (seconds < 10) {
            seconds = '0' + seconds;
        }

        var res = hours ? (hours + ':' + ('0' + minutes).slice(-2) + ':' + seconds) : (minutes + ':' + seconds);
        if (days) {
            res = days + '.' + res;
        }
        return (isNegative ? ('-' + res) : res);
    }

//模仿服务器端(.net,C#)持续时间格式,例如:

    public static string Format(this TimeSpan interval)
    {
        string pattern;
        if (interval.Days > 0)          pattern = @"d\.h\:mm\:ss";
        else if (interval.Hours > 0)    pattern = @"h\:mm\:ss";
        else                            pattern = @"m\:ss";
        return string.Format("{0}", interval.ToString(pattern));
    }

1

您可以将Momentement.jsmoment-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>

另请参阅此小提琴


就像超级按钮(未定义的格式除外)一样,可以用月,日,小时,分钟和秒转换对象中的持续时间
Pi Home Server

1

const secondsToTime = (seconds, locale) => {
    const date = new Date(0);
    date.setHours(0, 0, seconds, 0);
    return date.toLocaleTimeString(locale);
}
console.log(secondsToTime(3610, "en"));

语言环境参数(“ en”,“ de”等)是可选的


1
secToHHMM(number: number) {
    debugger;
    let hours = Math.floor(number / 3600);
    let minutes = Math.floor((number - (hours * 3600)) / 60);
    let seconds = number - (hours * 3600) - (minutes * 60);
    let H, M, S;
    if (hours < 10) H = ("0" + hours);
    if (minutes < 10) M = ("0" + minutes);
    if (seconds < 10) S = ("0" + seconds);
    return (H || hours) + ':' + (M || minutes) + ':' + (S || seconds);
}

1

这是2019年更新的一线客:

//your date
var someDate = new Date("Wed Jun 26 2019 09:38:02 GMT+0100") 

var result = `${String(someDate.getHours()).padStart(2,"0")}:${String(someDate.getMinutes()).padStart(2,"0")}:${String(someDate.getSeconds()).padStart(2,"0")}`

//result will be "09:38:02"

我认为OP想要转换持续时间(秒)而不是Date对象。
mrdaliri

糟糕,我不好:(
DataGreed

1

这是一个相当简单的解决方案,可以四舍五入到最接近的秒数!

var returnElapsedTime = function(epoch) {
  //We are assuming that the epoch is in seconds
  var hours = epoch / 3600,
      minutes = (hours % 1) * 60,
      seconds = (minutes % 1) * 60;
  return Math.floor(hours) + ":" + Math.floor(minutes) + ":" + Math.round(seconds);
}


1

这是我最近为MM:SS写的。这个问题并不精确,但这是一种不同的单行格式。

const time = 60 * 2 + 35; // 2 minutes, 35 seconds
const str = (~~(time / 60) + "").padStart(2, '0') + ":" + (~~((time / 60) % 1 * 60) + "").padStart(2, '0');

str // 02:35

编辑:这是为增加多样性而添加的,但是最好的解决方案是下面的https://stackoverflow.com/a/25279399/639679

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.