reloj - JavaScript de segundos a la cadena de tiempo con formato hh: mm: ss

reloj jquery

Question

Quiero convertir una duración de tiempo, es decir, el número de segundos en una cadena de tiempo separada por dos puntos (hh: mm: ss)

Encontré algunas respuestas útiles aquí, pero todas hablan sobre la conversión al formato x horas y x minutos.

Entonces, ¿hay un pequeño fragmento de código que hace esto en jQuery o simplemente JavaScript en bruto?

Answer 1

Aquí está mi visión de la solución. Puedes probar mi fragmento abajo.

function secToHHMM(sec) {
  var d = new Date();
  d.setHours(0);
  d.setMinutes(0);
  d.setSeconds(0);
  d = new Date(d.getTime() + sec*1000);
  return d.toLocaleString(''en-GB'').split('' '')[1];
};

alert( ''One hour: '' + secToHHMM(60*60) ); // ''01:00:00''
alert( ''One hour five minutes: '' + secToHHMM(60*60 + 5*60) ); // ''01:05:00''
alert( ''One hour five minutes 23 seconds: '' + secToHHMM(60*60 + 5*60 + 23) ); // ''01:05:23''

Answer 2

Aquí está otra versión, que maneja días también:

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

Answer 3

Aquí hay una versión moderna de ES6:

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

Resultados previstos:

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

Answer 4

Así es como lo hice. Parece funcionar bastante bien, y es extremadamente compacto. (Aunque utiliza muchos operadores ternarios)

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
}

... y para formatear cadenas ...

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

Answer 5

Asi es como lo hice

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) devolverá ''258d 14h 5m 38s''

Answer 6

Creo que el rendimiento es el más rápido:

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

Answer 7

Es bastante facil

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

Answer 8

Hay un nuevo método para cadenas en el bloque: padStart

const str = ''5'';
str.padStart(2, ''0''); // 05

Aquí hay un ejemplo de un caso de uso: duraciones de YouTube en 4 líneas de JavaScript

Answer 9

Me encantó la respuesta de Powtac, pero quería usarla en Angular, así que creé un filtro usando su código.

.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;
    };
}])

Es funcionalmente idéntico, excepto que agregué en un campo de decimales opcional para mostrar los segundos fraccionarios. Úsalo como lo harías con cualquier otro filtro:

{{ elapsedTime | HHMMSS }} {{ elapsedTime | HHMMSS }} muestra: 01:23:45

{{ elapsedTime | HHMMSS : 3 }} {{ elapsedTime | HHMMSS : 3 }} muestra: 01:23:45.678

Answer 10

Me gustó más la respuesta de Webjins, así que la extendí para mostrar días con sufijo de anuncio, hacer que la visualización fuera condicional e incluirla como sufijo en segundos simples:

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

devuelve "3d 16:32:12" o "16:32:12" o "32:12" o "12s"

Answer 11

Me gusta la primera respuesta. Hay algunas optimizaciones:

• Los datos de origen son un número. No se necesitan cálculos adicionales.

• mucho exceso de computación

Código de resultado:

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

Answer 12

Me gustaría votar la respuesta de artem, pero soy un nuevo póster. Me expandí en su solución, aunque no fue lo que pidió el OP de la siguiente manera

    t=(new Date()).toString().split(" ");
    timestring = (t[2]+t[1]+'' <b>''+t[4]+''</b> ''+t[6][1]+t[7][0]+t[8][0]);

Llegar

04 de octubre de 16:31:28 PDT

Esto me funciona ...

Pero si estás empezando solo con una cantidad de tiempo, uso dos funciones; Uno para formatear y rellenar, y otro para calcular:

function sec2hms(timect){

  if(timect=== undefined||timect==0||timect === null){return ''''};
  //timect is seconds, NOT milliseconds
  var se=timect % 60; //the remainder after div by 60
  timect = Math.floor(timect/60);
  var mi=timect % 60; //the remainder after div by 60
  timect = Math.floor(timect/60);
  var hr = timect % 24; //the remainder after div by 24
  var dy = Math.floor(timect/24);
  return padify (se, mi, hr, dy);
}

function padify (se, mi, hr, dy){
  hr = hr<10?"0"+hr:hr;
  mi = mi<10?"0"+mi:mi;
  se = se<10?"0"+se:se;
  dy = dy>0?dy+"d ":"";
  return dy+hr+":"+mi+":"+se;
}

Answer 13

Para obtener la parte de tiempo en el formato hh:MM:ss , puede usar esta expresión regular:

(Esto fue mencionado anteriormente en el mismo post por alguien, gracias por eso).

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

Answer 14

Personalmente prefiero la unidad principal (días, horas, minutos) sin ceros iniciales. Pero los segundos siempre deben estar guiados por minutos (0:13), esta presentación es fácilmente considerada como ''duración'', sin más explicaciones (marcados como min, sec (s), etc.), utilizables en varios idiomas (internacionalización).

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

// imitando el formato del lado del servidor (.net, C #) como:

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

Answer 15

Puede administrar esto sin ninguna biblioteca JS externa con la ayuda del método JS Date, como se muestra a continuación:

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

Answer 16

Puede usar la siguiente función para convertir el tiempo (en segundos) al formato 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 : '':'' );
}

Sin pasar un separador, usa : como el separador (predeterminado):

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

Si desea utilizarlo - como separador, simplemente páselo como segundo parámetro:

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

Manifestación

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

Véase también este violín .

Answer 17

Puede utilizar Momement.js con el complemento de moment-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>

Ver también este Fiddle

Answer 18

Recomiendo javascript ordinario, usando el objeto Date:

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

(Por supuesto, el objeto Date creado tendrá una fecha real asociada, pero los datos son extraños, por lo que para estos fines, no tiene que preocuparse por eso).

Answer 19

Se puede usar una expresión regular para hacer coincidir la subcadena de tiempo en la cadena devuelta por el método toString() del objeto Date, que tiene el siguiente formato: "Jue 05 de julio de 2012 02:45:12 GMT + 0100 (GMT Daylight Time) ". Tenga en cuenta que esta solución usa el tiempo desde la época: la medianoche del 1 de enero de 1970. Esta solución puede ser de una sola línea, aunque dividirla hace que sea mucho más fácil de entender.

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

Answer 20

Si sabe la cantidad de segundos que tiene, esto funcionará. También utiliza el objeto Date () nativo.

function formattime(numberofseconds){    
    var zero = ''0'', hours, minutes, seconds, time;

    time = new Date(0, 0, 0, 0, 0, numberofseconds, 0);

    hh = time.getHours();
    mm = time.getMinutes();
    ss = time.getSeconds() 

    // Pad zero values to 00
    hh = (zero+hh).slice(-2);
    mm = (zero+mm).slice(-2);
    ss = (zero+ss).slice(-2);

    time = hh + '':'' + mm + '':'' + ss;
    return time; 
}

Answer 21

Una búsqueda en Google dio como resultado este resultado :

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

Answer 22

Usando la increíble librería 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);
}

Esto le permite especificar cualquier duración, ya sea en horas, minutos, segundos, molinos y devuelve una versión legible para humanos.

Answer 23

Variación sobre un tema. Maneja los segundos de un dígito un poco diferente

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

Answer 24

Versión no prototipo de toHHMMSS:

    function toHHMMSS(seconds) {
        var sec_num = parseInt(seconds);
        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;}
        var time    = hours+'':''+minutes+'':''+seconds;
        return time;
    }   

Answer 25

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

resultado 15:08:03

Answer 26

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

Puedes usarlo ahora como:

alert("5678".toHHMMSS());

Fragmento de trabajo:

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;
}
    
console.log("5678".toHHMMSS());

Answer 27

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

Answer 28

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

Ejemplos

toHHMMSS(111); "01:51" toHHMMSS(4444); "01:14:04" toHHMMSS(33); "00:33"

Answer 29

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

resultado:

1d 10h 17m 36s

Answer 30

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