如何使用JavaScript将秒转换为HH-MM-SS字符串?
当前回答
再来看看这个老话题——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"
...我试图让它使用尽可能少的代码,这是一种很好的一行程序方法。
其他回答
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.
}
}
在JavaScript Date方法的帮助下,你可以在没有任何外部JavaScript库的情况下做到这一点,如下:
const date = new Date(null);
date.setSeconds(SECONDS); // specify value for SECONDS here
const result = date.toISOString().slice(11, 19);
或者,按照@Frank的评论;一句话:
new Date(SECONDS * 1000).toISOString().slice(11, 19);
这里没有一个答案满足我的要求,因为我想能够处理
大量的秒(天),以及 负数
尽管OP不要求这些,但是覆盖边缘情况是一个很好的实践,特别是当它不需要花费太多精力时。
很明显,当他说秒的时候,OP的意思是秒的数量。为什么要把函数固定在字符串上?
function secondsToTimeSpan(seconds) {
const value = Math.abs(seconds);
const days = Math.floor(value / 1440);
const hours = Math.floor((value - (days * 1440)) / 3600);
const min = Math.floor((value - (days * 1440) - (hours * 3600)) / 60);
const sec = value - (days * 1440) - (hours * 3600) - (min * 60);
return `${seconds < 0 ? '-':''}${days > 0 ? days + '.':''}${hours < 10 ? '0' + hours:hours}:${min < 10 ? '0' + min:min}:${sec < 10 ? '0' + sec:sec}`
}
secondsToTimeSpan(0); // => 00:00:00
secondsToTimeSpan(1); // => 00:00:01
secondsToTimeSpan(1440); // => 1.00:00:00
secondsToTimeSpan(-1440); // => -1.00:00:00
secondsToTimeSpan(-1); // => -00:00:01
对于HH:MM:SS的特殊情况。MS (eq: "00:04:33.637"), FFMPEG用来指定毫秒。
[-] [HH: MM: SS(打烊……) 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];
}
我只是想对上面这个不错的答案做一点解释:
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);
On the second line, since there are 3600 seconds in 1 hour, we divide the total number of seconds by 3600 to get the total number of hours. We use parseInt to strip off any decimal. If totalSec was 12600 (3 and half hours), then parseInt( totalSec / 3600 ) would return 3, since we will have 3 full hours. Why do we need the % 24 in this case? If we exceed 24 hours, let's say we have 25 hours (90000 seconds), then the modulo here will take us back to 1 again, rather than returning 25. It is confining the result within a 24 hour limit, since there are 24 hours in one day.
当你看到这样的东西:
25 % 24
你可以这样想:
25 mod 24 or what is the remainder when we divide 25 by 24
推荐文章
- 如何让元素被点击(对于整个文档)?
- 我如何检查如果一个变量是JavaScript字符串?
- 如何检测如果多个键被按下一次使用JavaScript?
- MySQL中两个日期之间的差异
- 如何通过history. pushstate获得历史变化的通知?
- 在Bash中获取日期(比当前时间早一天)
- 使用jQuery改变输入字段的类型
- 在JavaScript中,什么相当于Java的Thread.sleep() ?
- 使用jQuery以像素为整数填充或边距值
- 检查是否选择了jQuery选项,如果没有选择默认值
- Next.js React应用中没有定义Window
- 如何重置笑话模拟函数调用计数之前,每次测试
- 如何强制一个功能React组件渲染?
- 在javascript中从平面数组构建树数组
- 将Dropzone.js与其他字段集成到现有的HTML表单中