Como converter segundos em uma HH-MM-SS
string usando JavaScript?
Como converter segundos em uma HH-MM-SS
string usando JavaScript?
Respostas:
Você não conhece datejs ? é um deve saber.
Usando datejs, basta escrever algo como:
(new Date).clearTime()
.addSeconds(15457)
.toString('H:mm:ss');
--atualizar
Atualmente, date.js está desatualizado e não é mantido, portanto, use " Moment.js ", que é muito melhor como indicado por TJ Crowder.
- atualização 2
Por favor, use @ Frank é uma solução de uma linha:
new Date(SECONDS * 1000).toISOString().substr(11, 8)
É de longe a melhor solução.
TypeError: Object [object Date] has no method 'clearTime'
.
Você pode fazer isso sem nenhuma biblioteca JavaScript externa com a ajuda do método JavaScript Date, como a seguir:
var date = new Date(null);
date.setSeconds(SECONDS); // specify value for SECONDS here
var result = date.toISOString().substr(11, 8);
Ou, como no comentário de @Frank ; um forro:
new Date(SECONDS * 1000).toISOString().substr(11, 8);
new Date(SECONDS * 1000).toISOString().substr(11, 8);
Object doesn't support property or method 'toISOString'
Eu não acho que nenhum recurso interno do objeto Date padrão faça isso por você de uma maneira mais conveniente do que apenas fazer as contas sozinho.
hours = Math.floor(totalSeconds / 3600);
totalSeconds %= 3600;
minutes = Math.floor(totalSeconds / 60);
seconds = totalSeconds % 60;
Exemplo:
0.05
na hours
variável. Coloquei dentro de um parseInt
que o corrigia para o meu caso, mas acho que não seria preciso para tudo. Ainda assim, isso me ajudou, então obrigado!
parseInt
-lo, isso é para analisar seqüências de caracteres , não manipular números. Math.floor
seria a operação relevante aqui.
seconds = Math.floor(totalSeconds % 60);
. Também obtive um resultado decimal lá também.
totalSeconds % 60
só pode ter uma parte fracionária se totalSeconds
tiver uma parte fracionária. Se você deseja usar o chão, isso dependerá da perda ou retenção dessas informações. (As outras operações de chão que estamos fazendo não perca nenhuma informação, porque eles estão apenas limpando os dados que acabam em minutes
e seconds
.)
console.log( hours +':'+ ('0'+minutes).slice(-2) +':'+ ('0'+seconds).slice(-2) );
Eu sei que isso é meio velho, mas ...
ES2015:
var toHHMMSS = (secs) => {
var sec_num = parseInt(secs, 10)
var hours = Math.floor(sec_num / 3600)
var minutes = Math.floor(sec_num / 60) % 60
var seconds = sec_num % 60
return [hours,minutes,seconds]
.map(v => v < 10 ? "0" + v : v)
.filter((v,i) => v !== "00" || i > 0)
.join(":")
}
Ele produzirá:
toHHMMSS(129600) // 36:00:00
toHHMMSS(13545) // 03:45:45
toHHMMSS(180) // 03:00
toHHMMSS(18) // 00:18
Como Cleiton apontou em sua resposta , o moment.js pode ser usado para isso:
moment().startOf('day')
.seconds(15457)
.format('H:mm:ss');
moment().startOf('year').seconds(30000000).format('DDD HH:mm:ss')
.
.format('YYYY DDD HH:mm:ss')
function formatSeconds(seconds)
{
var date = new Date(1970,0,1);
date.setSeconds(seconds);
return date.toTimeString().replace(/.*(\d{2}:\d{2}:\d{2}).*/, "$1");
}
var timeInSec = "661"; //even it can be string
String.prototype.toHHMMSS = function () {
/* extend the String by using prototypical inheritance */
var seconds = parseInt(this, 10); // don't forget the second param
var hours = Math.floor(seconds / 3600);
var minutes = Math.floor((seconds - (hours * 3600)) / 60);
seconds = seconds - (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;
return time;
}
alert("5678".toHHMMSS()); // "01:34:38"
console.log(timeInSec.toHHMMSS()); //"00:11:01"
podemos tornar essa função muito mais curta e nítida, mas isso diminui a legibilidade; portanto, a escreveremos da maneira mais simples e estável possível.
ou você pode verificar isso trabalhando aqui :
Aqui está uma extensão para a classe Number. toHHMMSS () converte segundos em uma sequência hh: mm: ss.
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>
Fácil de seguir versão para noobies:
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);
Esta função deve fazer isso:
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 : ':' );
}
Sem passar um separador, ele usa :
como separador (padrão):
time = convertTime(13551.9941351); // --> OUTPUT = 03:45:51
Se você deseja usar -
como separador, apenas passe-o como o segundo parâmetro:
time = convertTime(1126.5135155, '-'); // --> OUTPUT = 00-18-46
Veja também este violino .
:
como padrão para o separator
parâmetro, como já expliquei. Isso é feito pela declaração typeof separator !== 'undefined' ? separator : ':'
. Além disso, sua função é praticamente idêntica à minha, exceto algumas alterações cosméticas e ambas devem produzir a mesma saída ... exceto que minha versão tem um suporte de navegador muito melhor. O seu não vai funcionar em qualquer versão do Internet Explorer ou MS Borda <14.
abaixo está o código fornecido que converterá segundos no formato hh-mm-ss:
var measuredTime = new Date(null);
measuredTime.setSeconds(4995); // specify value of SECONDS
var MHSTime = measuredTime.toISOString().substr(11, 8);
Obtenha método alternativo do Converter segundos para o formato HH-MM-SS em JavaScript
Para o caso especial de HH: MM: SS.MS (eq: "00: 04: 33.637") conforme usado pelo FFMPEG para especificar milissegundos .
[-] [HH:] MM: SS [.m ...]
HH expressa o número de horas, MM o número de minutos para um máximo de 2 dígitos e SS o número de segundos para um máximo de 2 dígitos. O m no final expressa o valor decimal para 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)
)
Exemplo de uso, um cronômetro de transporte em milissegundos:
/* 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>
Exemplo de uso, vinculado a um elemento de mídia
/* 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>
Fora da questão, essas funções escritas em 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];
}
+ "." + p.getMilliseconds()
usando new Date(p.getTime()-o.getTime()).toISOString().split("T")[1].split("Z")[0]
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.
}
}
Eu só queria dar uma pequena explicação para a boa resposta acima:
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);
Na segunda linha, como há 3600 segundos em 1 hora, dividimos o número total de segundos por 3600 para obter o número total de horas. Usamos parseInt para remover qualquer decimal. Se totalSec fosse 12600 (3 horas e meia), então parseInt (totalSec / 3600) retornaria 3, pois teremos 3 horas completas. Por que precisamos do% 24 neste caso? Se excedermos 24 horas, digamos que temos 25 horas (90000 segundos), o módulo aqui nos levará de volta a 1 novamente, em vez de retornar 25. Está limitando o resultado dentro de um limite de 24 horas, pois existem 24 horas em um dia.
Quando você vê algo assim:
25 % 24
Pense assim:
25 mod 24 or what is the remainder when we divide 25 by 24
Integrando esse segmento antigo - o OP declarou HH: MM: SS e muitas das soluções funcionam, até você perceber que precisa de mais de 24 horas listadas. E talvez você não queira mais do que uma única linha de código. Aqui está:
d=(s)=>{f=Math.floor;g=(n)=>('00'+n).slice(-2);return f(s/3600)+':'+g(f(s/60)%60)+':'+g(s%60)}
Retorna H +: MM: SS. Para usá-lo, basta usar:
d(91260); // returns "25:21:00"
d(960); // returns "0:16:00"
... Tentei fazer com que ele usasse a menor quantidade de código possível, para uma boa abordagem de uma linha.
Você já tentou adicionar segundos a um objeto Date?
var dt = new Date();
dt.addSeconds(1234);
Uma amostra: https://jsfiddle.net/j5g2p0dc/5/
Atualizado: o link de amostra estava ausente, por isso criei um novo.
addSeconds
no objeto Date como Date.prototype.addSeconds = function(seconds){...}
. Sim, funciona, obrigado pela atualização.
Aqui está uma função para converter segundos para o formato hh-mm-ss com base na resposta de powtac aqui
/**
* Convert seconds to hh-mm-ss format.
* @param {number} totalSeconds - the total seconds to convert to hh- mm-ss
**/
var SecondsTohhmmss = function(totalSeconds) {
var hours = Math.floor(totalSeconds / 3600);
var minutes = Math.floor((totalSeconds - (hours * 3600)) / 60);
var seconds = totalSeconds - (hours * 3600) - (minutes * 60);
// round seconds
seconds = Math.round(seconds * 100) / 100
var result = (hours < 10 ? "0" + hours : hours);
result += "-" + (minutes < 10 ? "0" + minutes : minutes);
result += "-" + (seconds < 10 ? "0" + seconds : seconds);
return result;
}
Exemplo de uso
var seconds = SecondsTohhmmss(70);
console.log(seconds);
// logs 00-01-10
Depois de analisar todas as respostas e não ficar feliz com a maioria delas, foi isso que eu vim. Eu sei que estou muito atrasado para a conversa, mas aqui está assim mesmo.
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;
}
Crio um novo objeto Date, altero a hora para meus parâmetros, converto o objeto Date em uma string de tempo e removi os itens adicionais dividindo a string e retornando apenas a parte necessária.
Eu pensei em compartilhar essa abordagem, uma vez que elimina a necessidade de regex, lógica e acrobacias matemáticas para obter os resultados no formato "HH: mm: ss" e, em vez disso, conta com métodos internos.
Você pode dar uma olhada na documentação aqui: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date
Existem muitas opções para resolver esse problema, e obviamente existem boas opções sugeridas, mas quero adicionar mais um código otimizado aqui
function formatSeconds(sec) {
return [(sec / 3600), ((sec % 3600) / 60), ((sec % 3600) % 60)]
.map(v => v < 10 ? "0" + parseInt(v) : parseInt(v))
.filter((i, j) => i !== "00" || j > 0)
.join(":");
}
se você não quiser zero formatado com menos de 10 números, poderá usar
function formatSeconds(sec) {
return parseInt(sec / 3600) + ':' + parseInt((sec % 3600) / 60) + ':' + parseInt((sec % 3600) % 60);
}
Código de amostra http://fiddly.org/1c476/1
Em uma linha, usando a solução de TJ Crowder:
secToHHMMSS = seconds => `${Math.floor(seconds / 3600)}:${Math.floor((seconds % 3600) / 60)}:${Math.floor((seconds % 3600) % 60)}`
Em uma linha, outra solução que também conta dias:
secToDHHMMSS = seconds => `${parseInt(seconds / 86400)}d ${new Date(seconds * 1000).toISOString().substr(11, 8)}`
Fonte: https://gist.github.com/martinbean/2bf88c446be8048814cf02b2641ba276
Você também pode usar o código abaixo:
int ss = nDur%60;
nDur = nDur/60;
int mm = nDur%60;
int hh = nDur/60;
new Date().toString().split(" ")[4];
resultado 15:08:03
Para quem usa o AngularJS, uma solução simples é filtrar o valor com a API da data , que converte milissegundos em uma cadeia de caracteres com base no formato solicitado. Exemplo:
<div>Offer ends in {{ timeRemaining | date: 'HH:mm:ss' }}</div>
Observe que isso espera milissegundos, portanto, você pode multiplicar o timeRemaining por 1000 se estiver convertendo de segundos (conforme a pergunta original foi formulada).
Eu me deparei com o caso que alguns mencionaram em que o número de segundos é superior a um dia. Aqui está uma versão adaptada da resposta mais bem avaliada do @Harish Anchu que é responsável por períodos mais longos:
function secondsToTime(seconds) {
const arr = new Date(seconds * 1000).toISOString().substr(11, 8).split(':');
const days = Math.floor(seconds / 86400);
arr[0] = parseInt(arr[0], 10) + days * 24;
return arr.join(':');
}
Exemplo:
secondsToTime(101596) // outputs '28:13:16' as opposed to '04:13:16'
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;
}
Exemplo de uso
alert("186".toHHMMSS());
Nenhuma das respostas aqui atende aos meus requisitos, pois eu quero poder lidar com
Embora esses não sejam exigidos pelo OP, é uma boa prática cobrir casos extremos, especialmente quando é preciso pouco esforço.
É bastante óbvio é que o OP significa NÚMERO de segundos quando ele diz segundos . Por que atribuir sua função String
?
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
secondsToTimeSpan(8991)
retornos 6.00:05:51
enquanto eu acho que ele deve retornar00:02:29:51
Eu usei esse código antes para criar um objeto de período de tempo simples:
function TimeSpan(time) {
this.hours = 0;
this.minutes = 0;
this.seconds = 0;
while(time >= 3600)
{
this.hours++;
time -= 3600;
}
while(time >= 60)
{
this.minutes++;
time -= 60;
}
this.seconds = time;
}
var timespan = new Timespan(3662);