Строка времени в секундах в JavaScript в формате чч: мм: сс

Я хочу преобразовать продолжительность времени, то есть количество секунд в строку времени, разделенную двоеточиями (чч: мм: сс)

Я нашел здесь несколько полезных ответов, но все они говорят о преобразовании в формат x часов и x минут.

Так есть ли крошечный фрагмент, который делает это в jQuery или просто в необработанном JavaScript?


person medk    schedule 10.06.2011    source источник
comment
Тесты некоторых из предложенных ответов в этой теме. jsperf.com/ms-to-hh-mm-ss-time- формат   -  person Claudijo    schedule 04.06.2013


Ответы (43)


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

Теперь вы можете использовать это как:

alert("5678".toHHMMSS());

Рабочий фрагмент:

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

person powtac    schedule 10.06.2011
comment
Спасибо за идею прототипа, мне нравится, как это проще назвать. Я создал прототип Числа, так что могу назвать его и им. Я также нашел этот ответ, в котором будут удалены часы и минуты, если они не нужны. - person alunsford3; 25.05.2012
comment
вау, это потрясающе! Ненавижу иметь дело со временем в javascript. - person simey.me; 17.08.2013
comment
Просто интересно ... какая конкретная причина передавать секунды в виде строки, а не целого числа? - person DA.; 19.01.2014
comment
@DA. Строка также будет работать для Number, но не наоборот. - person powtac; 20.01.2014
comment
используйте оператор% ›› var minutes = Math.floor ((sec_num% 3600) / 60); var seconds = Math.floor (sec_num% 60); - person IvanM; 31.03.2014
comment
классная идея! просто любопытно, почему именно строка, а не прототип числа? поскольку секунды обычно являются целым числом и должны быть преобразованы в строку. Это работает для меня ((date2 - date1) / 1000) .secondsToTimespan () - person Sonic Soul; 26.06.2015
comment
@ sonic-soul см. stackoverflow.com/questions/6312993/ - person powtac; 26.06.2015
comment
ах спасибо. Я не вижу, чтобы он работал в обоих направлениях как строка, пока вы не вызовете .toString () для целого числа. вы можете заставить его работать наоборот, также проанализировав int - person Sonic Soul; 27.06.2015
comment
Не используйте прототип, просто создайте служебную функцию. - person Michael J. Calkins; 07.10.2015
comment
Примечание: не работает в отрицательное время. (Мой таймер начинается с -60 секунд, отсчитывая до нуля до старта, а затем продолжает работу.) - person Dustin Graham; 10.01.2017
comment
модифицировать прототип под такую ​​штуку? 390 голосов? шутки в сторону? - person Lukas Liesis; 26.05.2017
comment
выбить чч: если время меньше часа, if(result.length === 8 && result.substring(0,3) === "00:"){ return result.substr(3); } else { return result; } - person Ronnie Royston; 13.05.2018
comment
Я надеюсь, что в наши дни в университете не так преподают CS. Ответ, получивший наибольшее количество голосов, - это тот, который использует ЧИСЛО секунд в виде строки, а затем parseInt(), чтобы иметь возможность выполнять вычисления. Шутки в сторону. Если вы имеете дело с секундами или отрицательным числом дней, см. stackoverflow.com/a/55896694/2028733. - person Duoc Tran; 29.04.2019
comment
Это не сработает для определенных значений, и секунды будут отображаться как 60. Пример 00:14:60. Удивлен большим количеством голосов за это решение, и никто, похоже, на самом деле не тестировал его полностью. - person AndroidDev; 07.05.2019
comment
@AndroidDev это не так. Взгляните на этот тест: jsfiddle.net/powtac/1aoLqpr4 он выводит 00:14:59 и 00:15:00. Нет возможности вызвать ваш результат. - person powtac; 08.05.2019
comment
@DuocTran Большинство значений, особенно при извлечении из HTML или, например, JSON, являются строками, поскольку их можно передавать только как строки. Поэтому естественно начать с чтения строк, а затем в функции, анализирующей значение в int. Таким образом, рассматриваются оба наиболее распространенных варианта использования (строка и чистый int). Здесь пользователю не нужно различать значение типа. - person powtac; 08.05.2019
comment
@LukasLiesis Да, это совсем не выглядит хорошо. Кроме того, он не должен использовать ввод String, а Int ... другой ответ лучше. Думаю, проблема в том, что мы не можем отозвать свой голос. Stackoverflow говорит: последний раз вы голосовали за этот ответ 9 минут назад. Ваш голос теперь заблокирован, если этот ответ не будет отредактирован. - person Barney Szabolcs; 11.05.2020
comment
@Barney только что отредактировал ответ, чтобы он работал как вспомогательная функция. - person Lukas Liesis; 11.05.2020

Вы можете сделать это без какой-либо внешней библиотеки JS с помощью метода JS Date, как показано ниже:

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

person Harish Anchu    schedule 13.08.2014
comment
Почему этот ответ такой низкий? Я получил его в 2011 году, вероятно, IE 7 и 8 были базой, которая его не поддерживает, но сейчас конец 2014 года, так что это простое простое решение без суеты должно быть намного выше. - person Emil Borconi; 10.12.2014
comment
Из MDN: если указанный вами параметр находится за пределами ожидаемого диапазона, setSeconds () пытается соответствующим образом обновить информацию о дате в объекте Date. Например, если вы используете 100 для secondsValue, минуты, хранящиеся в объекте Date, будут увеличены на 1, а 40 будет использоваться для секунд. Так что да, выглядит хорошо! - person Andrew; 09.02.2015
comment
Мне нравится этот ответ. Может быть и короче: new Date(1000 * seconds).toISOString().substr(11, 8). - person Bohumir Zamecnik; 17.08.2016
comment
Хороший ответ. Вы можете использовать .replace(/^[0:]+/, "") после substr, чтобы удалить все нули и : из начала строки. - person Palo; 11.02.2017
comment
Добавьте это впереди, чтобы обрабатывать время более 24 часов. parseInt (d / 86400) + d - person Tofandel; 17.10.2019
comment
@Palo в этом нет необходимости, поскольку substr выбирает сегмент строки. Вы можете просто изменить аргументы, чтобы выбрать ту часть строки, которую хотите сохранить. Тем не менее, substr постепенно сокращается для substring, и, кроме того, slice - очень похожий метод, который, вероятно, больше подходит для использования в вашей кодовой базе, поскольку он, как правило, более популярен в дикой природе. - person Esten; 16.04.2020
comment
Отличное решение. Добавляем этот очевидный бит для тех, кто не знает: если вам нужен только mm: ss, вы меняете substr на это: var timeString = date.toISOString().substr(14, 5); - person Matt Kenefick; 28.04.2020
comment
Это прерывается, если продолжительность превышает 23:59:59. - person sim642; 26.09.2020

Чтобы получить часть времени в формате hh:MM:ss, вы можете использовать это регулярное выражение:

(Об этом кто-то упомянул выше в том же сообщении, спасибо за это.)

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

person Raj    schedule 27.09.2012
comment
+1 - Супер-простой; Благодарность! Просто использовал вариант этого, чтобы показывать только минуты и секунды: var myDate = new Date().toTimeString().replace(/.*(\d{2}:\d{2})(:\d{2}).*/, "$1"); - person Topher Fangio; 17.05.2013
comment
не должно быть new Date (null, null, null, null, null, timeInSecs) .toTimeString (). replace (/.* (\ d {2}:) (\ d {2}: \ d {2} ). * /, $ 2)? - person obie; 27.08.2013
comment
Использование replace сбивает с толку. Почему бы не использовать new Date(null, null, null, null, null, timeInSeconds).toTimeString().match(/\d{2}:\d{2}:\d{2}/)[0]? - person Călin Darie; 04.01.2014
comment
Это нормально для отображения заданного времени, но обратите внимание, что вопрос (и другие ответы здесь) касается отображения продолжительности, то есть заданного количества секунд независимо от текущего времени. - person mahemoff; 29.09.2014
comment
как нам изменить регулярное выражение, чтобы оно генерировало чч: ММ? - person puppeteer701; 04.08.2015
comment
new Date().toTimeString().replace(/^(\d{2}:\d{2}).*/, "$1") можно использовать для hh: MM - обратите внимание, что исходное регулярное выражение начинается с /.*. Это жадное совпадение, и оно будет соответствовать минутам и секундам, а не часам и минутам. Использование /^ заставляет регулярное выражение соответствовать началу строки. - person David Clarke; 26.10.2015
comment
Не отвечает на вопрос. - person Eirik Birkeland; 10.02.2016
comment
Более простая версия этого: new Date().toTimeString().split(" ")[0] - person Henrik N; 15.04.2016
comment
Очень простой. Большое спасибо. - person Nguyễn Anh Tuấn; 09.01.2017
comment
Как я могу вернуться к операции? - person Umesh Patadiya; 15.04.2019
comment
Чтобы узнать прошедшее с этого момента время, используйте new Date(time*1000).toISOString().replace(/.*(\d{2}:\d{2}:\d{2}).*/, "$1"); не используйте toTimeString, иначе возникнут проблемы со смещением по Гринвичу. - person Tofandel; 17.10.2019

Я рекомендую обычный javascript, использующий объект Date. (Более короткое решение с использованием toTimeString см. Во втором фрагменте кода.)

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

(Конечно, с созданным объектом Date будет связана фактическая дата, но эти данные не имеют отношения к делу, поэтому для этих целей вам не нужно беспокоиться об этом.)


Изменить (краткое решение):

Воспользуйтесь функцией toTimeString. и разделить на пробелы:

var seconds = 9999; // Some arbitrary value
var date = new Date(seconds * 1000); // multiply by 1000 because Date() requires miliseconds
var timeStr = date.toTimeString().split(' ')[0];

toTimeString дает '16:54:58 GMT-0800 (PST)', а разделение по первому пробелу дает '16:54:58'.

person JellicleCat    schedule 10.06.2011
comment
Кажется, что дата находится в местном часовом поясе, что в моем случае добавляет 1 час ко времени. С секундами = 0 я получаю 01:00:00 (четверг, 01 января 1970 г., 01:00:00 GMT + 0100 (CET)), что неверно. - person mivk; 07.06.2013
comment
Я получаю правильный результат, если использую date.getUTCHours() и date.getUTCMinutes(). - person mivk; 07.06.2013
comment
Я не понимаю, почему вы возвращаете 12-часовую метку времени, когда он просил о продолжительности? - person Nathan C. Tresch; 27.01.2015
comment
@JellicleCat Изменено на +1, красивое имя. - person Nathan C. Tresch; 27.01.2015
comment
Мне это нравится, но предполагается, что продолжительность меньше 24 часов. - person Rory; 28.01.2018
comment
Добавьте parseInt (d / 86400) + d вперед, чтобы обрабатывать случаи более 24 часов - person Tofandel; 17.10.2019
comment
Часовые пояса ненавидят это. - person Ryan The Leach; 10.12.2020

Поиск в Google дал этот результат:

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;
}
person Ash Burlaczenko    schedule 10.06.2011
comment
secondsToTime(119.9) = ›Object {h: 0, m: 1, s: 60}. Чтобы исправить это, добавьте secs = Math.round(secs); в начале метода. Конечно, мы видели этот баг во время демонстрации ... - person Benjamin Crouzier; 18.11.2013

Вот мой взгляд на это:

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

Ожидаемые результаты:

const expect = require('expect');
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');
expect(formatTime(0.2)).toEqual('0:00');
person Tom Esterez    schedule 31.10.2016
comment
Вы можете написать это как: const formatTime = (seconds, h = Math.floor(seconds / 3600), m = Math.floor((seconds % 3600) / 60), s = seconds % 60) => [h, m > 9 ? m : '0' + m, s > 9 ? s : '0' + s].filter(s => s).join(':'); - person Ruben Stolk; 08.01.2018
comment
@RubenStolk Мне немного сбивает с толку наличие функции, которая принимает два second аргумента. Я считаю свою версию более ясной, даже если она немного более подробна. - person Tom Esterez; 09.01.2018
comment
seconds: number аннотации типа в es6? - person Olian04; 10.07.2018
comment
у вас есть лишняя запятая в конце: s > 9 ? s : '0' + s, - person pstanton; 03.02.2020
comment
Завершающая запятая @pstanton допустима в JS. Я предпочитаю иметь их, чтобы было проще добавлять / удалять / перемещать строки: developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/ - person Tom Esterez; 04.02.2020
comment
@TomEsterez вызывает синтаксические ошибки в более ранних версиях браузеров - в лучшем случае субъективно - person pstanton; 05.02.2020
comment
Завершающая запятая @pstanton поддерживается начиная с IE9: caniuse.com/#feat=mdn-javascript_grammar_trailing_commas . Я лично предпочитаю игнорировать эти старые браузеры. Но вы правы, я удалил его, поэтому ответ более общий. - person Tom Esterez; 06.02.2020
comment
Отличное решение. Может просто поменять секунды как const s = Math.round(seconds % 60); - person Raff; 03.04.2020
comment
@Raff, модуль (%) уже возвращает целочисленное значение, поэтому Math.round не требуется. - person Tom Esterez; 05.04.2020
comment
Собственно, ты прав. Секунды ввода могут иметь десятичные дроби. Так что я его поменяю ???? - person Tom Esterez; 05.04.2020

Вариация на тему. Немного иначе обрабатывает однозначные секунды

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;
}
person jottos    schedule 28.09.2011
comment
Спасибо, что сэкономили мне час на этом - person starsinmypockets; 18.10.2013

Мне нравится первый ответ. Есть некоторые оптимизации:

  • исходные данные - это число. дополнительных расчетов не требуется.

  • много лишних вычислений

Код результата:

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;
}
person Serge K.    schedule 13.11.2012
comment
Я думаю, что эта функция используется во фронтенде, и поэтому я прототипирую String, а не Number. И Number всегда может быть строкой, но не наоборот. - person powtac; 14.11.2012
comment
Я думаю, что Number прав, потому что seconds, на самом деле, число. перед использованием этой функции вы должны выполнить преобразование из строки, и это правильно! - person caesarsol; 03.12.2013
comment
одобренный ответ, как и этот, плох. Бьюсь об заклад, вам не нужны ВСЕ числа для использования этого метода. Не изменяйте прототип для случайных утилит. - person Lukas Liesis; 26.05.2017
comment
или просто создать прототип и сделать его функцией numToHHMMSS или strTOHHMMSS - person yeahdixon; 22.01.2019
comment
Это решение работает, пока выбранное решение генерирует 60 секунд для определенных значений. - person AndroidDev; 07.05.2019

Используя замечательную библиотеку 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);
}

Это позволяет вам указать любую продолжительность, будь то часы, минуты, секунды, миллионы, и возвращает удобочитаемую версию.

person Pradeep    schedule 18.05.2013

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

результат 15:08:03

person Artem Kyba    schedule 08.08.2013
comment
Приятно - спасибо! И небольшое улучшение, которое я сделал для своих нужд, заключалось в преобразовании длительности в миллисекундах в HH: MM: SS - new Date(new Date().getTime() - startTime).toUTCString().split(" ")[4], где startTime было установлено ранее с использованием startTime = new Date().getTime();. (Мне пришлось использовать toUTCString(), потому что иначе время выходило бы за час.) - person IpsRich; 17.03.2015

Это довольно просто,

function toTimeString(seconds) {
  return (new Date(seconds * 1000)).toUTCString().match(/(\d\d:\d\d:\d\d)/)[0];
}
person Hung Vo    schedule 14.04.2015
comment
Это работает только в том случае, если ваша продолжительность составляет менее 1 дня. Но в остальном довольно мило. - person cjbarth; 12.11.2015

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

результат:

1d 10h 17m 36s
person Andy Wu    schedule 10.10.2013

Самый простой способ это сделать.

new Date(sec * 1000).toISOString().substr(11, 8)
person Arjun Kava    schedule 27.07.2020
comment
К вашему сведению, это по модулю 24 часа, поэтому, если вы введете эквивалент 25 часов, он будет отображаться как 1 час. Будь осторожен - person maxime1992; 30.11.2020

Мне больше всего понравился ответ Webjins, поэтому я расширил его, чтобы отображать дни с суффиксом d, сделал отображение условным и включил суффикс s в простые секунды:

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

возвращает «3d 16:32:12», «16:32:12», «32:12» или «12s».

person nïkö    schedule 13.02.2015
comment
Это будет неверно для продолжительности 24 дня и более. - person Charlie Martin; 07.12.2015
comment
почему вы сравниваете строки больше 0? - person Jimmy Kane; 14.04.2018
comment
@JimmyKane, потому что автоматическое приведение типов - мне это нравится! (плюс: код легче читать (у вас есть типизация по какой-то причине, но давайте прекратим троллинг (мы оба)). плюс: функция не сработает, только если t равно NaN - поэтому, если вам нужна безопасность: сделайте это на входе!) - person nïkö; 23.04.2019
comment
@ nïkö Хорошо, я понимаю, но более строгие новые версии JS, линтеры и т. д. могут жаловаться на это. Просто говорю, понимаешь меня неправильно. Мне нравится твой ответ - person Jimmy Kane; 24.04.2019

Мне понравился ответ Powtac, но я хотел использовать его в angular.js, поэтому я создал фильтр, используя его код.

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

Функционально он идентичен, за исключением того, что я добавил необязательное поле десятичных знаков для отображения дробных секунд. Используйте его, как любой другой фильтр:

{{ elapsedTime | HHMMSS }} отображает: 01:23:45

{{ elapsedTime | HHMMSS : 3 }} отображает: 01:23:45.678

person Mordred    schedule 28.10.2014
comment
У меня есть два объекта datetime, и я хочу вычислить разницу между этими двумя объектами datetime и вернуть вывод, как в этом формате: Час: Минуты: Секунды с двойной цифрой, например: 01: 02: 45. Не могли бы вы рассказать мне или немного помочь мне с вашим кодом ?? - person Learning-Overthinker-Confused; 05.07.2016

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

Примеры

    toHHMMSS(111); 
    "01:51"

    toHHMMSS(4444);
    "01:14:04"

    toHHMMSS(33);
    "00:33"
person mashi    schedule 10.04.2014
comment
Я бы поставил Math.floor() и на секунды, так как они могут быть даны в десятичных дробях. (Произошло со мной.) - person Winter; 11.09.2016

Вот еще одна версия, которая также обрабатывает дни:

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;
}
person M Katz    schedule 01.04.2013

Я думаю, что с точки зрения производительности это, безусловно, самый быстрый:

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
person Rutger van Baren    schedule 03.12.2013
comment
Действительно удивительным. Поздравляю! - person Brynner Ferreira; 28.09.2018
comment
Приятно ... и ›24 часа в безопасности. - person Jeffz; 15.11.2018

Вот как я это сделал. Кажется, работает неплохо, и он очень компактен. (Хотя он использует много тернарных операторов)

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
}

... и для форматирования строк ...

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

Вы можете использовать следующую функцию для преобразования времени (в секундах) в формат 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 : ':' );
}

Без передачи разделителя он использует : в качестве разделителя (по умолчанию):

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

Если вы хотите использовать - в качестве разделителя, просто передайте его как второй параметр:

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

Демо

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

См. Также эту скрипку.

person John Slegers    schedule 24.02.2017

В блоке появился новый метод для строк: padStart

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

Вот пример использования: Продолжительность YouTube за 4 строки JavaScript

person Boris Yakubchik    schedule 14.01.2018
comment
Это должен быть комментарий под ответом - person Cedric Ipkiss; 27.06.2021

Регулярное выражение может использоваться для сопоставления подстроки времени в строке, возвращаемой методом toString() объекта Date, которая имеет следующий формат: «Thu Jul 05 2012 02:45:12 GMT + 0100 (GMT Daylight Time)». Обратите внимание, что в этом решении используется время, прошедшее с эпохи: полночь 1 января 1970 года. Это решение может быть однострочным, хотя его разбиение на части упрощает понимание.

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");
}
person Ninjakannon    schedule 05.07.2012
comment
Часовые пояса ненавидят это. вопрос заключается в преобразовании секунд в продолжительность. - person Ryan The Leach; 10.12.2020

Это я недавно написал для MM: SS. Не совсем к вопросу, но это другой однострочный формат.

const time = 60 * 2 + 35; // 2 minutes, 35 seconds
const str = (~~(time / 60) + "").padStart(2, '0') + ":" + (~~((time / 60) % 1 * 60) + "").padStart(2, '0');

str // 02:35

Изменить: это было добавлено для разнообразия, но лучшим решением здесь является https://stackoverflow.com/a/25279399/639679 ниже.

person Matt Kenefick    schedule 21.04.2020

Вот как я это сделал

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) вернет '258d 14h 5m 38s'

person dt192    schedule 17.04.2013

Я лично предпочитаю ведущую единицу (дни, часы, минуты) без ведущих нулей. Но секунды всегда должны начинаться с минут (0:13), эту презентацию легко рассматривать как «продолжительность» без дополнительных пояснений (помеченных как min, sec (s) и т. Д.), Которую можно использовать на разных языках (интернационализация).

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

// имитация форматирования длительности на стороне сервера (.net, C #), например:

    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));
    }
person Peter Zehnder    schedule 28.03.2015

const secondsToTime = (seconds, locale) => {
    const date = new Date(0);
    date.setHours(0, 0, seconds, 0);
    return date.toLocaleTimeString(locale);
}
console.log(secondsToTime(3610, "en"));

где параметр локали ("en", "de" и т. д.) является необязательным.

person JukkaP    schedule 19.03.2018

Вот довольно простое решение с округлением до ближайшей секунды!

var returnElapsedTime = function(epoch) {
  //We are assuming that the epoch is in seconds
  var hours = epoch / 3600,
      minutes = (hours % 1) * 60,
      seconds = (minutes % 1) * 60;
  return Math.floor(hours) + ":" + Math.floor(minutes) + ":" + Math.round(seconds);
}

person Big Sam    schedule 19.12.2019

Самый общий ответ на это:

function hms(seconds) {
  return [3600, 60]
    .reduceRight(
      (p, b) => r => [Math.floor(r / b)].concat(p(r % b)),
      r => [r]
    )(seconds)
    .map(a => a.toString().padStart(2, '0'))
    .join(':');
}

Некоторые примеры выходов:

> hms(0)
< "00:00:00"

> hms(5)
< "00:00:05"

> hms(60)
< "00:01:00"

> hms(3785)
< "01:03:05"

> hms(37850)
< "10:30:50"

> hms(378500)
< "105:08:20"

См. Объяснение на странице https://stackoverflow.com/a/66504936/1310733

person Petr Újezdský    schedule 06.03.2021

Я бы поддержал ответ Артема, но я новый автор. Я расширил его решение, хотя и не то, что просил OP следующим образом

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

Получить

04окт. 16:31:28 по тихоокеанскому времени

Это работает для меня ...

Но если вы начинаете с количества времени, я использую две функции; один для форматирования и заполнения и один для расчета:

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;
}
person Michael D. Moradzadeh    schedule 04.10.2013

Если вы знаете, сколько секунд у вас есть, это сработает. Он также использует собственный объект Date ().

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; 
}
person webinista    schedule 12.10.2013

Непрототипная версия 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;
    }   
person joan16v    schedule 28.10.2014

Вот мое видение решения. Вы можете попробовать мой фрагмент ниже.

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'

person Vladimir    schedule 07.08.2015

Эта версия принятого ответа делает его немного красивее, если вы имеете дело с длиной видео, например:

1:37:40 (1 час / 37 минут / 40 секунд)

1:00 (1 минута)

2:20 (2 минуты 20 секунд)

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

  var hourSeparator = ':';
  var minuteSeparator = ':';

  if(hours == 0){hours = '';hourSeparator = '';}
  if (minutes < 10 && hours != 0) {minutes = "0"+minutes;}
  if (seconds < 10) {seconds = "0"+seconds;}
  var time = hours+hourSeparator+minutes+minuteSeparator+seconds;
  return time;
}
person user1683056    schedule 28.08.2015

Миллисекунды до продолжительности, простой способ:

// To have leading zero digits in strings.
function pad(num, size) {
    var s = num + "";
    while (s.length < size) s = "0" + s;
    return s;
}

// ms to time/duration
msToDuration = function(ms){
    var seconds = ms / 1000;
    var hh = Math.floor(seconds / 3600),
    mm = Math.floor(seconds / 60) % 60,
    ss = Math.floor(seconds) % 60,
    mss = ms % 1000;
    return pad(hh,2)+':'+pad(mm,2)+':'+pad(ss,2)+'.'+pad(mss,3);
}

Он преобразует 327577 в 00:05:27.577.

ОБНОВЛЕНИЕ

Другой способ для другого сценария:

toHHMMSS = function (n) {
    var sep = ':',
        n = parseFloat(n),
        sss = parseInt((n % 1)*1000),
        hh = parseInt(n / 3600);
    n %= 3600;
    var mm = parseInt(n / 60),
        ss = parseInt(n % 60);
    return pad(hh,2)+sep+pad(mm,2)+sep+pad(ss,2)+'.'+pad(sss,3);
    function pad(num, size) {
        var str = num + "";
        while (str.length < size) str = "0" + str;
        return str;
    }
}

toHHMMSS(6315.077) // Return 01:45:15.077
person Rodrigo Polo    schedule 25.08.2014

            //secondsToTime();
            var t = wachttijd_sec; // your seconds
            var hour = Math.floor(t/3600);
            if(hour < 10){
                hour = '0'+hour;
            }
            var time = hour+':'+('0'+Math.floor(t/60)%60).slice(-2)+':'+('0' + t % 60).slice(-2);
            //would output: 00:00:00 > +100:00:00

продолжает обратный отсчет, даже если более 24 часов

person phpFreak    schedule 29.11.2016
comment
Как ты. На самом деле не дает ничего существенного, что не было уже дано в одном или нескольких из 30 ответов. - person Ole V.V.; 29.11.2016
comment
действительно, Juist пытается помочь сохранить простоту - person phpFreak; 29.11.2016

Вы можете использовать Momement.js с момент-продолжительность-формат:

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>

См. Также эту скрипку

person Oleksiy Kachynskyy    schedule 09.05.2017
comment
Работает как чудо (за исключением формата, который не определен) для преобразования продолжительности в объекте с месяцами, днями, часами, минутами и секундами. - person Pi Home Server; 04.09.2017

function secondsToTime(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);

    if(hours >= 12)
    {
     var m= 'pm' ;
     }
     else
     {
         var m='am'
     }
     if(hours-12 >0)
     {
            var hrs = hours-12;
     }
     else if(hours-12 <0)
     {
            var hrs = hours;
     }
    var obj = {
        "h": hrs,
        "m": minutes,
        "s": seconds,
        "a":m
    };


    return obj;
}
var d = new Date();
var n = d.getHours();
var hms = d.getHours()+':'+d.getMinutes()+':'+d.getSeconds();   // your input string
var a = hms.split(':'); // split it at the colons

// minutes are worth 60 seconds. Hours are worth 60 minutes.
var seconds = (+a[0]) * 60 * 60 + (+a[1]) * 60 + (+a[2]); 




console.log(seconds);
console.log(secondsToTime(seconds))

https://jsfiddle.net/jithinksoft/9x6z4sdt/

person Rakesh    schedule 25.06.2017

Вот его версия для es6:

export const parseTime = (time) => { // send time in seconds
// eslint-disable-next-line 
let hours = parseInt(time / 60 / 60), mins = Math.abs(parseInt(time / 60) - (hours * 60)), seconds = Math.round(time % 60);
return isNaN(hours) || isNaN(mins) || isNaN(seconds) ? `00:00:00` : `${hours > 9 ? Math.max(hours, 0) : '0' + Math.max(hours, 0)}:${mins > 9 ? Math.max(mins, 0) : '0' + Math.max(0, mins)}:${seconds > 9 ? Math.max(0, seconds) : '0' + Math.max(0, seconds)}`;}
person Godwin Vinny Carole    schedule 29.11.2018

Вот обновленный однострочный текст на 2019 год:

//your date
var someDate = new Date("Wed Jun 26 2019 09:38:02 GMT+0100") 

var result = `${String(someDate.getHours()).padStart(2,"0")}:${String(someDate.getMinutes()).padStart(2,"0")}:${String(someDate.getSeconds()).padStart(2,"0")}`

//result will be "09:38:02"
person DataGreed    schedule 26.06.2019
comment
Я думаю, что OP хочет преобразовать продолжительность (секунды), а не объект Date. - person mrdaliri; 11.07.2019
comment
упс мой плохой :( - person DataGreed; 30.07.2019

Я видел, что все публикуют свои взгляды на проблему, несмотря на то, что несколько популярных ответов уже включают всю необходимую информацию для адаптации к конкретному варианту использования.

А поскольку я тоже хочу быть модным - вот мое ненужное и немного громоздкое решение:

а) Читабельный (надеюсь!)
б) Легко настраиваемый
в) Не печатает нулей

барабанная дробь

function durationToDDHHMMSSMS(durms) {
    if (!durms) return "??";

    var HHMMSSMS = new Date(durms).toISOString().substr(11, 12);
    if (!HHMMSSMS) return "??";

    var HHMMSS = HHMMSSMS.split(".")[0];
    if (!HHMMSS) return "??";

    var MS = parseInt(HHMMSSMS.split(".")[1],10);
    var split = HHMMSS.split(":");
    var SS = parseInt(split[2],10);
    var MM = parseInt(split[1],10);
    var HH = parseInt(split[0],10); 
    var DD = Math.floor(durms/(1000*60*60*24));

    var string = "";
    if (DD) string += ` ${DD}d`;
    if (HH) string += ` ${HH}h`;
    if (MM) string += ` ${MM}m`;
    if (SS) string += ` ${SS}s`;
    if (MS) string += ` ${MS}ms`;

    return string;
},

Обратите внимание, что в этом коде используются строки шаблона ES6, я уверен, что у такого умника, как вы, не возникнет трудностей, заменив их обычными строками, если потребуется.

person Max Yari    schedule 31.10.2019

Вот пример использования _1 _. Я выбрал GB в качестве языка, потому что в США в первый час отображается 24 вместо 00. Кроме того, я выбрал Etc/UTC в качестве часового пояса, потому что UTC имеет псевдоним в списке часовых поясов базы данных tz.

const formatTime = (seconds) =>
  new Date(seconds * 1000).toLocaleTimeString('en-GB', {
    timeZone:'Etc/UTC',
    hour12: false,
    hour: '2-digit',
    minute: '2-digit',
    second: '2-digit'
  });

console.log(formatTime(75)); // 00:01:15
.as-console-wrapper { top: 0; max-height: 100% !important; }

Вот тот же пример, но с Intl.DateTimeFormat < / а>. Этот вариант позволяет вам создать экземпляр многократно используемого объекта форматирования, который является более производительным.

const dateFormatter = new Intl.DateTimeFormat('en-GB', {
  timeZone:'Etc/UTC',
  hour12: false,
  hour: '2-digit',
  minute: '2-digit',
  second: '2-digit'
});

const formatTime = (seconds) => dateFormatter.format(new Date(seconds * 1000));

console.log(formatTime(75)); // 00:01:15
.as-console-wrapper { top: 0; max-height: 100% !important; }

person Mr. Polywhirl    schedule 09.06.2021
comment
Если время больше 24 часов (86400 секунд), это даст неверные результаты. - person Tim; 20.07.2021

Мне не нравится добавлять свойства к стандартным типам данных в JavaScript, поэтому я бы порекомендовал что-то вроде этого:

/**
 * Format a duration in seconds to a human readable format using the notion
 * "h+:mm:ss", e.g. "4:40:78". Negative durations are preceeded by "-".
 *
 * @param t Duration in seconds
 * @return The formatted duration string
 */
var readableDuration = (function() {

    // Each unit is an object with a suffix s and divisor d
    var units = [
        {s: '', d: 1}, // Seconds
        {s: ':', d: 60}, // Minutes
        {s: ':', d: 60}, // Hours
    ];

    // Closure function
    return function(t) {
        t = parseInt(t); // In order to use modulus
        var trunc, n = Math.abs(t), i, out = []; // out: list of strings to concat
        for (i = 0; i < units.length; i++) {
            n = Math.floor(n / units[i].d); // Total number of this unit
            // Truncate e.g. 26h to 2h using modulus with next unit divisor
            if (i+1 < units.length) // Tweak substr with two digits
                trunc = ('00'+ n % units[i+1].d).substr(-2, 2); // …if not final unit
            else
                trunc = n;
            out.unshift(''+ trunc + units[i].s); // Output
        }
        (t < 0) ? out.unshift('-') : null; // Handle negative durations
        return out.join('');
    };
})();

Использование:

var str = readableDuration(3808); // "1:03:28"

Я также создал более общепринятую версию. Основное отличие состоит в том, что он принимает миллисекунды (что является своего рода стандартной единицей времени в JS), а в выходном формате вместо них используются пробелы.

person Betamos    schedule 22.08.2013

person    schedule
comment
Дальнейшее объяснение того, почему этот ответ сработает для спрашивающего или что могло быть неправильным в исходном вопросе, поможет повысить качество этого ответа. - person Josh Burgess; 18.04.2017
comment
Довольно понятный и хороший ответ, сокращенный и упрощенный главный ответ. - person AlexioVay; 17.12.2017
comment
Точный ответ :) - person Rishav Kumar; 05.02.2019