logo标签列表

用JavaScript将秒转换为HH-MM-SS？

javascriptdatetimedate-formattime-format
394

如何使用JavaScript将秒数转换为HH-MM-SS格式的字符串？

3
请看我在https://dev59.com/JG015IYBdhLWcg3w7wMW#6313008的回答。 - powtac
38个回答
9

Here is an extension to Number class. toHHMMSS() converts seconds to an hh:mm:ss string. 

Number.prototype.toHHMMSS = function() {
  var hours = Math.floor(this / 3600) < 10 ? ("00" + Math.floor(this / 3600)).slice(-2) : Math.floor(this / 3600);
  var minutes = ("00" + Math.floor((this % 3600) / 60)).slice(-2);
  var seconds = ("00" + (this % 3600) % 60).slice(-2);
  return hours + ":" + minutes + ":" + seconds;
}

// Usage: [number variable].toHHMMSS();

// Here is a simple test
var totalseconds = 1234;
document.getElementById("timespan").innerHTML = totalseconds.toHHMMSS();
// HTML of the test
<div id="timespan"></div>

5

在这个老帖子上发表意见 - OP提到了HH:MM:SS，许多解决方案都可以工作，直到你意识到你需要列出超过24小时的时间。也许你不想要超过一行代码。这里是：

d=(s)=>{f=Math.floor;g=(n)=>('00'+n).slice(-2);return f(s/3600)+':'+g(f(s/60)%60)+':'+g(s%60)}

它返回H+:MM:SS格式。要使用它，只需使用以下代码：
d(91260);     // returns "25:21:00"
d(960);       // returns "0:16:00"

我尝试使用尽可能少的代码来实现，以实现简洁的一行代码。

1
你能提供一个扩展/阅读版本的代码吗？这样我们就可以更容易地看到正在发生的事情了。谢谢。 - Kimball
5

易于理解的版本，适合新手：

 var totalNumberOfSeconds = YOURNUMBEROFSECONDS;
 var hours = parseInt( totalNumberOfSeconds / 3600 );
 var minutes = parseInt( (totalNumberOfSeconds - (hours * 3600)) / 60 );
 var seconds = Math.floor((totalNumberOfSeconds - ((hours * 3600) + (minutes * 60))));
 var result = (hours < 10 ? "0" + hours : hours) + ":" + (minutes < 10 ? "0" + minutes : minutes) + ":" + (seconds  < 10 ? "0" + seconds : seconds);
 console.log(result);
5

对于特定情况下的 HH:MM:SS.MS （例如："00:04:33.637"），用于 FFMPEG 指定毫秒。

[-][HH:]MM:SS[.m...]

其中，HH 表示小时数，MM 表示分钟数（最多 2 位数字），SS 表示秒数（最多 2 位数字）。末尾的 m 表示 SS 的小数值。

/* HH:MM:SS.MS to (FLOAT)seconds ---------------*/
function timerToSec(timer){
   let vtimer = timer.split(":")
   let vhours = +vtimer[0]
   let vminutes = +vtimer[1]
   let vseconds = parseFloat(vtimer[2])
   return vhours * 3600 + vminutes * 60 + vseconds
}

/* Seconds to (STRING)HH:MM:SS.MS --------------*/
function secToTimer(sec){
  let o = new Date(0)
  let p =  new Date(sec*1000)  
  return new Date(p.getTime()-o.getTime())
    .toISOString()
    .split("T")[1]
    .split("Z")[0]
}

/* Example: 7hours, 4 minutes, 33 seconds and 637 milliseconds */
const t = "07:04:33.637"
console.log(
  t + " => " +
  timerToSec(t) +
  "s"
)

/* Test: 25473 seconds and 637 milliseconds */
const s = 25473.637 // "25473.637"
console.log(
  s + "s => " + 
  secToTimer(s)
)

示例用法，毫秒级传输计时器：

/* Seconds to (STRING)HH:MM:SS.MS --------------*/
function secToTimer(sec){
  let o = new Date(0)
  let p =  new Date(sec*1000)  
  return new Date(p.getTime()-o.getTime())
    .toISOString()
    .split("T")[1]
    .split("Z")[0]
}

let job, origin = new Date().getTime()
const timer = () => {
  job = requestAnimationFrame(timer)
  OUT.textContent = secToTimer((new Date().getTime() - origin) / 1000)
}

requestAnimationFrame(timer)
span {font-size:4rem}
<span id="OUT"></span>
<br>
<button onclick="origin = new Date().getTime()">RESET</button>
<button onclick="requestAnimationFrame(timer)">RESTART</button>
<button onclick="cancelAnimationFrame(job)">STOP</button>

示例用法，绑定到媒体元素

/* Seconds to (STRING)HH:MM:SS.MS --------------*/
function secToTimer(sec){
  let o = new Date(0)
  let p =  new Date(sec*1000)  
  return new Date(p.getTime()-o.getTime())
    .toISOString()
    .split("T")[1]
    .split("Z")[0]
}

VIDEO.addEventListener("timeupdate", function(e){
  OUT.textContent = secToTimer(e.target.currentTime)
}, false)
span {font-size:4rem}
<span id="OUT"></span><br>
<video id="VIDEO" width="400" controls autoplay>
  <source src="https://www.w3schools.com/html/mov_bbb.mp4" type="video/mp4">
</video>

除了问题之外，这些函数是用 PHP 编写的：

<?php 
/* HH:MM:SS to (FLOAT)seconds ------------------*/
function timerToSec($timer){
  $vtimer = explode(":",$timer);
  $vhours = (int)$vtimer[0];
  $vminutes = (int)$vtimer[1];
  $vseconds = (float)$vtimer[2];
  return $vhours * 3600 + $vminutes * 60 + $vseconds;
}
/* Seconds to (STRING)HH:MM:SS -----------------*/
function secToTimer($sec){
  return explode(" ", date("H:i:s", $sec))[0];  
}
1
你可以通过使用以下代码来省略 + "." + p.getMilliseconds()：new Date(p.getTime()-o.getTime()).toISOString().split("T")[1].split("Z")[0] - Yuna
1
看起来不错，是的，你的版本更快：请参见基准测试 http://jsben.ch/4sQY1 接受编辑！谢谢。 - NVRM
5
这个函数应该能完成此任务：
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

另请参见此Fiddle。

可以使用默认参数，例如（input，separator =“：”）。直到我稍微修改了一下它，它才返回任何内容。 - madprops
@madprops：实际上，我回答中的版本已经将“：”设置为separator参数的默认值，正如我已经解释过的那样。这是通过语句typeof separator !== 'undefined' ? separator : ':'完成的。此外，你的函数与我的几乎完全相同，除了一些外观上的变化，它们应该都能产生相同的输出...除了我的版本具有更好的浏览器支持。你的函数在任何版本的Internet Explorer或MS Edge <14中都无法工作。 - John Slegers
4

在查阅了所有回答并对大部分回答不满意后，我想到了以下方案。尽管我来晚了，但还是分享一下。

function secsToTime(secs){
  var time = new Date(); 
  // create Date object and set to today's date and time
  time.setHours(parseInt(secs/3600) % 24);
  time.setMinutes(parseInt(secs/60) % 60);
  time.setSeconds(parseInt(secs%60));
  time = time.toTimeString().split(" ")[0];
  // time.toString() = "HH:mm:ss GMT-0800 (PST)"
  // time.toString().split(" ") = ["HH:mm:ss", "GMT-0800", "(PST)"]
  // time.toTimeString().split(" ")[0]; = "HH:mm:ss"
  return time;
}

我创建了一个新的Date对象，将时间更改为所需参数，将Date对象转换为时间字符串，然后通过分割字符串并仅返回需要的部分来删除额外的内容。
我想分享这种方法，因为它消除了使用正则表达式、逻辑和数学技巧以获得"HH:mm:ss"格式结果的需要，而是依赖于内置的方法。
您可以在此处查看文档：https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Date。
4

将秒转换为hh:mm:ss格式的简单函数：

function getHHMMSSFromSeconds(totalSeconds) {
    if (!totalSeconds) {
      return '00:00:00';
    }
    const hours = Math.floor(totalSeconds / 3600);
    const minutes = Math.floor(totalSeconds % 3600 / 60);
    const seconds = totalSeconds % 60;
    const hhmmss = padTo2(hours) + ':' + padTo2(minutes) + ':' + padTo2(seconds);
    return hhmmss;
}

// function to convert single digit to double digit
function padTo2(value) {
    if (!value) {
      return '00';
    }
    return value < 10 ? String(value).padStart(2, '0') : value;
}
4
以下是给定的代码，将秒转换为hh-mm-ss格式：
var measuredTime = new Date(null);
measuredTime.setSeconds(4995); // specify value of SECONDS
var MHSTime = measuredTime.toISOString().substr(11, 8);

从JavaScript中将秒转换为HH-MM-SS格式获取替代方法。
你是从这个答案复制粘贴的吗？ - StefansArya
3
var time1 = date1.getTime();
var time2 = date2.getTime();
var totalMilisec = time2 - time1;

alert(DateFormat('hh:mm:ss',new Date(totalMilisec)))

 /* ----------------------------------------------------------
 *  Field        | Full Form          | Short Form
 *  -------------|--------------------|-----------------------
 *  Year         | yyyy (4 digits)    | yy (2 digits)
 *  Month        | MMM (abbr.)        | MM (2 digits)
                 | NNN (name)         |
 *  Day of Month | dd (2 digits)      | 
 *  Day of Week  | EE (name)          | E (abbr)
 *  Hour (1-12)  | hh (2 digits)      | 
 *  Minute       | mm (2 digits)      | 
 *  Second       | ss (2 digits)      | 
 *  ----------------------------------------------------------
 */
function DateFormat(formatString,date){
    if (typeof date=='undefined'){
    var DateToFormat=new Date();
    }
    else{
        var DateToFormat=date;
    }
    var DAY         = DateToFormat.getDate();
    var DAYidx      = DateToFormat.getDay();
    var MONTH       = DateToFormat.getMonth()+1;
    var MONTHidx    = DateToFormat.getMonth();
    var YEAR        = DateToFormat.getYear();
    var FULL_YEAR   = DateToFormat.getFullYear();
    var HOUR        = DateToFormat.getHours();
    var MINUTES     = DateToFormat.getMinutes();
    var SECONDS     = DateToFormat.getSeconds();

    var arrMonths = new Array("January","February","March","April","May","June","July","August","September","October","November","December");
    var arrDay=new Array('Sunday','Monday','Tuesday','Wednesday','Thursday','Friday','Saturday');
    var strMONTH;
    var strDAY;
    var strHOUR;
    var strMINUTES;
    var strSECONDS;
    var Separator;

    if(parseInt(MONTH)< 10 && MONTH.toString().length < 2)
        strMONTH = "0" + MONTH;
    else
        strMONTH=MONTH;
    if(parseInt(DAY)< 10 && DAY.toString().length < 2)
        strDAY = "0" + DAY;
    else
        strDAY=DAY;
    if(parseInt(HOUR)< 10 && HOUR.toString().length < 2)
        strHOUR = "0" + HOUR;
    else
        strHOUR=HOUR;
    if(parseInt(MINUTES)< 10 && MINUTES.toString().length < 2)
        strMINUTES = "0" + MINUTES;
    else
        strMINUTES=MINUTES;
    if(parseInt(SECONDS)< 10 && SECONDS.toString().length < 2)
        strSECONDS = "0" + SECONDS;
    else
        strSECONDS=SECONDS;

    switch (formatString){
        case "hh:mm:ss":
            return strHOUR + ':' + strMINUTES + ':' + strSECONDS;
        break;
        //More cases to meet your requirements.
    }
}
3

我只是想对上面的好回答做出一点解释：

var totalSec = new Date().getTime() / 1000;
var hours = parseInt( totalSec / 3600 ) % 24;
var minutes = parseInt( totalSec / 60 ) % 60;
var seconds = totalSec % 60;

var result = (hours < 10 ? "0" + hours : hours) + "-" + (minutes < 10 ? "0" + minutes : minutes) + "-" + (seconds  < 10 ? "0" + seconds : seconds);

在第二行，由于1小时有3600秒，我们将总秒数除以3600得到总小时数。我们使用parseInt函数去除任何小数部分。如果totalSec是12600（3个半小时），那么parseInt（totalSec / 3600）将返回3，因为我们有3个完整的小时。在这种情况下，为什么我们需要% 24？如果超过了24小时，比如说我们有25小时（90000秒），那么这里的模运算将把我们带回到1，而不是返回25。它将结果限制在24小时内，因为一天有24小时。
当你看到这样的东西时：
25 % 24

想象一下这样的情况：
25 mod 24 or what is the remainder when we divide 25 by 24
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接