Convertire i secondi in HH-MM-SS con JavaScript?


Risposte:


110

Non conosci datejs ? è assolutamente da sapere.

Usando datejs, basta scrivere qualcosa del tipo:

(new Date).clearTime()
          .addSeconds(15457)
          .toString('H:mm:ss');

--aggiornare

Oggi date.js è obsoleto e non mantenuto, quindi usa " Moment.js ", che è molto meglio come sottolineato da TJ Crowder.

--aggiornamento 2

Si prega di utilizzare @ Frank è una soluzione a una riga:

new Date(SECONDS * 1000).toISOString().substr(11, 8)

È di gran lunga la soluzione migliore.


11
@Yassir e Cleiton: FWIW, DateJS non è stato mantenuto da anni e ha un paio di bug eccezionali (anche se per quanto ne sappia, sono principalmente relativi all'analisi e alla mezzanotte). momentjs sembra abbastanza buono, ed è attualmente mantenuto.
TJ Crowder,

1
@Cleiton, la tua risposta aggiornata non è piena. Ho provato così com'è ed ho ottenuto: TypeError: Object [object Date] has no method 'clearTime'.
Hamish Grubijan,

19
Concesso Moment.js non è poi così grande, ma se tutto ciò che stai facendo è convertire i secondi in hh: mm: ss, sembra un po 'eccessivo. Piuttosto usa una delle funzioni suggerite in queste o altre risposte.
Ola Karlsson,

5
Penso che l'altra soluzione sia meglio che lanciare un'altra libreria js nel mix.
Donato,

4
Aggiungendo una libreria per una semplice azione, penso che non dovrebbe essere accettata la risposta. Sì, funziona, ma ci sono soluzioni migliori !!!
Andris,

405

Puoi riuscire a farlo senza alcuna libreria JavaScript esterna con l'aiuto del metodo JavaScript Date come il seguente:

var date = new Date(null);
date.setSeconds(SECONDS); // specify value for SECONDS here
var result = date.toISOString().substr(11, 8);

Oppure, secondo il commento di @Frank ; una fodera:

new Date(SECONDS * 1000).toISOString().substr(11, 8);

39
Non so perché tutti stiano aggiungendo ulteriori librerie o facendo la matematica manualmente quando questo funziona perfettamente. Grazie!
jminardi,

98
Questo può anche essere ridotto a una riga: new Date(SECONDS * 1000).toISOString().substr(11, 8);
Frank

4
Brillante. Senza alcuna lib di terze parti. È meglio
Riz,

41
Il problema con questo approccio è che traboccerà dopo 24 ore, impedendoti di mostrare più di questo periodo di tempo. Soluzione perfetta se hai meno di 24 ore in pochi secondi.
Renato Gama,

1
Questo non funziona per me in IE11, ricevoObject doesn't support property or method 'toISOString'
NibblyPig il

153

Non credo che nessuna caratteristica integrata dell'oggetto Date standard lo farà per te in un modo che sia più conveniente che fare semplicemente la matematica da solo.

hours = Math.floor(totalSeconds / 3600);
totalSeconds %= 3600;
minutes = Math.floor(totalSeconds / 60);
seconds = totalSeconds % 60;

Esempio:


Ci sono alcuni problemi con questo, penso? Quando l'ho provato, stavo ottenendo i decimali, quindi 180 secondi sarebbero tornati 0.05nella hoursvariabile. L'ho inserito in uno parseIntche lo ha riparato per il mio caso, ma non penso che sarebbe accurato per tutto. Tuttavia, questo mi ha aiutato, quindi grazie!
BT643,

@ BT643: strano che non l'ho gestito. L'ho fatto ora, non vuoi usarlo parseInt, è per analizzare le stringhe , non manipolare i numeri. Math.floorsarebbe l'operazione pertinente qui.
TJ Crowder,

1
Ah ok! Ho cambiato il mio codice. Anche se non probabilmente desidera sui secondi pure: seconds = Math.floor(totalSeconds % 60);. Ho appena ottenuto un risultato decimale anche lì.
BT643,

@ BT643: totalSeconds % 60può avere una porzione frazionaria solo se totalSecondsha una porzione frazionaria. Se si desidera pavimentare dipenderà dal fatto che si desideri perdere tali informazioni o conservarle. (Le operazioni dell'altro piano che stiamo eseguendo non perdono alcuna informazione, perché stanno semplicemente cancellando i dati che finiranno in minutese seconds.)
TJ Crowder

8
@HannounYassirconsole.log( hours +':'+ ('0'+minutes).slice(-2) +':'+ ('0'+seconds).slice(-2) );
Xavi Esteve

60

So che questo è un po 'vecchio, ma ...

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(":")
}

Produrrà:

toHHMMSS(129600) // 36:00:00
toHHMMSS(13545) // 03:45:45
toHHMMSS(180) // 03:00
toHHMMSS(18) // 00:18

2
Che dire delle frazioni di secondo? 03: 45: 45.xxx?
Mike Stoddart,

1
@ SantiagoHernández Ottimo! Ora funziona perfettamente per oltre 24 ore.
Stefnotch,

2
+1. Questa o la TJ dovrebbe essere la risposta accettata, poiché quelle sono le uniche che funzionano per situazioni in cui la durata supera le 24 ore (e la domanda non limita la durata).
George Y.

38

Come ha sottolineato Cleiton nella sua risposta , moment.js può essere usato per questo:

moment().startOf('day')
        .seconds(15457)
        .format('H:mm:ss');

5
Cosa succede se il numero di secondi supera un giorno?
Gilad Peleg,

3
@GiladPeleg se il numero di secondi supera un giorno, il numero di giorni viene calcolato internamente e restituirà solo le restanti ore, minuti e secondi. Se vuoi contare anche il numero di giorni, puoi provare moment().startOf('year').seconds(30000000).format('DDD HH:mm:ss').
elquimista

9
Cosa succede se il numero di secondi supera un anno?
OrangePot

3
@OrangePot se il numero di secondi supera un anno, il numero di anni viene calcolato internamente e restituirà solo i restanti giorni, ore, minuti e secondi. Se vuoi contare anche il numero di anni, puoi provare.format('YYYY DDD HH:mm:ss')
David Callanan il

1
Ma questo non può essere reso opzionale. Potrebbe sembrare brutto.
shaedrich,

22
function formatSeconds(seconds)
{
    var date = new Date(1970,0,1);
    date.setSeconds(seconds);
    return date.toTimeString().replace(/.*(\d{2}:\d{2}:\d{2}).*/, "$1");
}

2
formatSeconds (3919); // Restituisce 01:05:19 Funzione eccellente .. Mi piace
Samrat Saha

17

Questo fa il trucco:

function secondstotime(secs)
{
    var t = new Date(1970,0,1);
    t.setSeconds(secs);
    var s = t.toTimeString().substr(0,8);
    if(secs > 86399)
        s = Math.floor((t - Date.parse("1/1/70")) / 3600000) + s.substr(2);
    return s;
}

(Proveniente da qui )


12
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"

possiamo rendere questa funzione molto più breve e nitida ma ciò riduce la leggibilità, quindi la scriveremo nel modo più semplice possibile e il più stabile possibile.

oppure puoi verificare che funzioni qui :


inoltre ... se vuoi fare facilmente tutte le cose con l'ora della data .. usa momentJS
Sheelpriy

Grazie! non è necessario includere una libreria in un'estensione del browser. Semplice e funziona!
Arlo,

9

Prova questo:

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

7

Ecco un'estensione per la classe Number. toHHMMSS () converte i secondi in una stringa 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>


5

Versione facile da seguire per i 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);

5

Questa funzione dovrebbe farlo:

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 : ':' );
}

Senza passare un separatore, utilizza :come separatore (predefinito):

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

Se si desidera utilizzare -come separatore, basta passarlo come secondo parametro:

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

Vedi anche questo violino .


Potrebbe utilizzare parametri predefiniti come (input, separator = ":"). Inoltre non ha restituito nulla fino a quando non l'ho modificato un po ' paste.ee/p/FDNag
madprops

@madprops: in realtà, la versione nella mia risposta è già impostata :come predefinita per il separatorparametro, come ho già spiegato. Questo è fatto dalla dichiarazione typeof separator !== 'undefined' ? separator : ':'. Inoltre, la tua funzione è praticamente identica alla mia, salvo alcuni cambiamenti estetici e dovrebbero entrambi produrre lo stesso output ... tranne che la mia versione ha un supporto del browser molto migliore. Il tuo non funzionerà in QUALSIASI versione di Internet Explorer o MS Edge <14.
John Slegers,


5

Per il caso speciale di HH: MM: SS.MS (eq: "00: 04: 33.637") utilizzato da FFMPEG per specificare i millisecondi .

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

HH esprime il numero di ore, MM il numero di minuti per un massimo di 2 cifre e SS il numero di secondi per un massimo di 2 cifre. La m alla fine esprime il valore decimale per 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)
)

Esempio di utilizzo, un timer di trasporto in millisecondi:

/* 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>

Esempio di utilizzo, associato a un elemento multimediale

/* 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>


Al di fuori della domanda, quelle funzioni scritte in 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
Puoi + "." + p.getMilliseconds()new Date(p.getTime()-o.getTime()).toISOString().split("T")[1].split("Z")[0]
ometterti

1
Va bene, sì, la tua versione è più veloce: vedi benchmark jsben.ch/4sQY1 Modifica accettata! Grazie.
NVRM

4
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.
    }
}

4

Volevo solo dare una piccola spiegazione alla bella risposta sopra:

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);

Sulla seconda riga, poiché ci sono 3600 secondi in 1 ora, dividiamo il numero totale di secondi per 3600 per ottenere il numero totale di ore. Usiamo parseInt per eliminare qualsiasi decimale. Se totalSec fosse 12600 (3 ore e mezza), quindi parseInt (totalSec / 3600) restituirebbe 3, poiché avremo 3 ore intere. Perché abbiamo bisogno di% 24 in questo caso? Se superiamo le 24 ore, supponiamo di avere 25 ore (90000 secondi), quindi il modulo qui ci riporterà nuovamente a 1, anziché restituire 25. Si sta limitando il risultato entro un limite di 24 ore, poiché ci sono 24 ore in un giorno.

Quando vedi qualcosa del genere:

25 % 24

Pensalo in questo modo:

25 mod 24 or what is the remainder when we divide 25 by 24

4

Rispondi su questo vecchio thread: l'OP ha dichiarato HH: MM: SS e molte delle soluzioni funzionano, fino a quando non ti rendi conto che hai bisogno di più di 24 ore elencate. E forse non vuoi più di una singola riga di codice. Ecco qui:

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

Restituisce H +: MM: SS. Per usarlo, basta usare:

d(91260);     // returns "25:21:00"
d(960);       // returns "0:16:00"

... Ho cercato di far sì che usasse la minima quantità di codice possibile, per un buon approccio one-liner.


1
Puoi fornire anche una versione estesa / di lettura del tuo codice in modo da poter vedere più facilmente cosa sta succedendo? Grazie.
Kimball

3

Hai provato ad aggiungere secondi a un oggetto Date?

var dt = new Date();
dt.addSeconds(1234);

Un esempio: https://jsfiddle.net/j5g2p0dc/5/

Aggiornato: mancava il link di esempio, quindi ne ho creato uno nuovo.


Uncaught TypeError: dt.addSeconds non è una funzione
Ikrom

@Ikrom controlla l'esempio, ne ho creato uno nuovo in jsfiddle poiché quello vecchio ha restituito l'errore 404
kpull1

Sembra che non abbia rilasciato che stavi usando un metodo personalizzato addSecondssull'oggetto Date come Date.prototype.addSeconds = function(seconds){...}. Sì, funziona, grazie per l'aggiornamento.
Ikrom,

2

Ecco una funzione per convertire i secondi nel formato hh-mm-ss in base alla risposta di powtac qui

jsfiddle

/** 
 * 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;
}

Esempio di utilizzo

var seconds = SecondsTohhmmss(70);
console.log(seconds);
// logs 00-01-10

2

Dopo aver esaminato tutte le risposte e non essere soddisfatto della maggior parte di esse, questo è quello che mi è venuto in mente. So di essere in ritardo per la conversazione, ma eccolo qui comunque.

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;
}

Creo un nuovo oggetto Date, cambio l'ora ai miei parametri, converto l'oggetto Date in una stringa temporale e rimuovo il materiale aggiuntivo suddividendo la stringa e restituendo solo la parte necessaria.

Ho pensato di condividere questo approccio, poiché elimina la necessità di acrobazie regex, logiche e matematiche per ottenere i risultati nel formato "HH: mm: ss", e invece si basa su metodi integrati.

Puoi dare un'occhiata alla documentazione qui: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date


2

Ci sono molte opzioni per risolvere questo problema, ed è ovvio che ci sono buone opzioni suggerite, ma voglio aggiungere un altro codice ottimizzato qui

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 non vuoi lo zero formattato con meno di 10 numeri, puoi usare

function formatSeconds(sec) {
  return parseInt(sec / 3600) + ':' + parseInt((sec % 3600) / 60) + ':' + parseInt((sec % 3600) % 60);

}

Codice di esempio http://fiddly.org/1c476/1


2

In una riga, usando la soluzione di TJ Crowder:

secToHHMMSS = seconds => `${Math.floor(seconds / 3600)}:${Math.floor((seconds % 3600) / 60)}:${Math.floor((seconds % 3600) % 60)}`

In una riga, un'altra soluzione che conta anche i giorni:

secToDHHMMSS = seconds => `${parseInt(seconds / 86400)}d ${new Date(seconds * 1000).toISOString().substr(11, 8)}`

Fonte: https://gist.github.com/martinbean/2bf88c446be8048814cf02b2641ba276


2
var sec_to_hms = function(sec){
var min, hours;
     sec = sec - (min = Math.floor(sec/60))*60;
     min = min - (hours = Math.floor(min/60))*60;
     return (hours?hours+':':'') + ((min+'').padStart(2, '0')) + ':'+ ((sec+'').padStart(2, '0'));
}
alert(sec_to_hms(2442542));

1

Puoi anche usare il codice seguente:

int ss = nDur%60;
nDur   = nDur/60;
int mm = nDur%60;
int hh = nDur/60;


1

Per chiunque utilizzi AngularJS, una soluzione semplice è quella di filtrare il valore con l' API date , che converte i millisecondi in una stringa in base al formato richiesto. Esempio:

<div>Offer ends in {{ timeRemaining | date: 'HH:mm:ss' }}</div>

Tieni presente che ciò richiede millisecondi, quindi potresti voler moltiplicare il tempo rimanente per 1000 se stai convertendo da pochi secondi (poiché la domanda originale era stata formulata).


1

Mi sono imbattuto nel caso che alcuni hanno menzionato in cui il numero di secondi è superiore a un giorno. Ecco una versione adattata della risposta più votata di @Harish Anchu che rappresenta periodi di tempo più lunghi:

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(':');
}

Esempio:

secondsToTime(101596) // outputs '28:13:16' as opposed to '04:13:16'

1
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;
}

Esempio di utilizzo

alert("186".toHHMMSS());

1

Nessuna delle risposte qui soddisfa i miei requisiti come voglio essere in grado di gestire

  1. Gran numero di secondi (giorni) e
  2. Numeri negativi

Anche se quelli non sono richiesti dal PO, è buona pratica coprire casi limite, specialmente quando ci vuole poco sforzo.

È abbastanza ovvio che l'OP indica un NUMERO di secondi quando dice secondi . Perché attivare la funzione 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

1
secondsToTimeSpan(8991)ritorna 6.00:05:51mentre penso che dovrebbe tornare00:02:29:51
user1063287

0

Ho usato questo codice prima di creare un semplice oggetto timepan:

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);

1
i risultati del looping sono una pessima tecnica di codifica e non dovrebbero mai essere utilizzati, limiteranno la tua potenza di elaborazione e ti daranno un sito ritardato
yan bellavance
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.