Перетворити секунди в HH-MM-SS за допомогою JavaScript?

Як можна перетворити секунди в HH-MM-SSрядок за допомогою JavaScript?

Ви не знаєте datejs ? це необхідно знати.

Використовуючи datejs, просто напишіть щось на кшталт:

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

--оновити

На сьогоднішній день date.js застарів і не підтримується, тому використовуйте " Moment.js ", що набагато краще, як вказував TJ Crowder.

--оновлення 2

Будь ласка, використовуйте рішення для одного франка @ Frank:

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

Це далеко не найкраще рішення.

Ви можете зробити це без будь-якої зовнішньої бібліотеки JavaScript за допомогою методу дати дати JavaScript, наприклад:

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

Або, за коментарем @Frank ; один вкладиш:

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

Я не думаю, що будь-яка вбудована функція стандартного об'єкта Date зробить це для вас зручніше, ніж просто робити математику самостійно.

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

Приклад:

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

console.log("hours: " + hours);
console.log("minutes: " + minutes);
console.log("seconds: " + seconds);

// If you want strings with leading zeroes:
minutes = String(minutes).padStart(2, "0");
hours = String(hours).padStart(2, "0");
seconds = String(seconds).padStart(2, "0");
console.log(hours + ":" + minutes + ":" + seconds);

Я знаю, що це щось старе, але ...

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

Він виведе:

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

Як Клітон зазначив у своїй відповіді , moment.js може бути використаний для цього:

moment().startOf('day')
        .seconds(15457)
        .format('H: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");
}

Це робить трюк:

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

(Витіснено звідси )

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"

ми можемо зробити цю функцію набагато коротшою та чіткішою, але це зменшує читабельність, тому ми запишемо її максимально просто та максимально стабільно.

або ви можете перевірити це, працюючи тут :

Спробуйте це:

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

Ось розширення до класу Number. toHHMMSS () перетворює секунди в рядок 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>

Легка в дотриманні версія для 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);

Ця функція повинна виконувати це:

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

Дивіться також цю скрипку .

нижче наведений код, який перетворить секунди у формат hh-mm-ss:

var measuredTime = new Date(null);
measuredTime.setSeconds(4995); // specify value of SECONDS
var MHSTime = measuredTime.toISOString().substr(11, 8);

Отримайте альтернативний метод із перетворення секунд у формат HH-MM-SS у JavaScript

Для особливого випадку HH: MM: SS.MS (eq: "00: 04: 33.637"), який використовується FFMPEG для визначення мілісекунд .

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

HH виражає кількість годин, MM - кількість хвилин протягом максимум 2 цифр, а SS - кількість секунд для максимум 2 цифр. M в кінці виражає десяткове значення для SS.

/* HH:MM:SS.MS to (FLOAT)seconds ---------------*/
function timerToSec(timer){
   let vtimer = timer.split(":")
   let vhours = +vtimer[0]
   let vminutes = +vtimer[1]
   let vseconds = parseFloat(vtimer[2])
   return vhours * 3600 + vminutes * 60 + vseconds
}

/* Seconds to (STRING)HH:MM:SS.MS --------------*/
function secToTimer(sec){
  let o = new Date(0)
  let p =  new Date(sec*1000)  
  return new Date(p.getTime()-o.getTime())
    .toISOString()
    .split("T")[1]
    .split("Z")[0]
}

/* Example: 7hours, 4 minutes, 33 seconds and 637 milliseconds */
const t = "07:04:33.637"
console.log(
  t + " => " +
  timerToSec(t) +
  "s"
)

/* Test: 25473 seconds and 637 milliseconds */
const s = 25473.637 // "25473.637"
console.log(
  s + "s => " + 
  secToTimer(s)
)

Приклад використання, транспортний таймер мілісекунд:

/* Seconds to (STRING)HH:MM:SS.MS --------------*/
function secToTimer(sec){
  let o = new Date(0)
  let p =  new Date(sec*1000)  
  return new Date(p.getTime()-o.getTime())
    .toISOString()
    .split("T")[1]
    .split("Z")[0]
}

let job, origin = new Date().getTime()
const timer = () => {
  job = requestAnimationFrame(timer)
  OUT.textContent = secToTimer((new Date().getTime() - origin) / 1000)
}

requestAnimationFrame(timer)

span {font-size:4rem}

<span id="OUT"></span>
<br>
<button onclick="origin = new Date().getTime()">RESET</button>
<button onclick="requestAnimationFrame(timer)">RESTART</button>
<button onclick="cancelAnimationFrame(job)">STOP</button>

Приклад використання, прив’язаний до медіа-елемента

/* Seconds to (STRING)HH:MM:SS.MS --------------*/
function secToTimer(sec){
  let o = new Date(0)
  let p =  new Date(sec*1000)  
  return new Date(p.getTime()-o.getTime())
    .toISOString()
    .split("T")[1]
    .split("Z")[0]
}

VIDEO.addEventListener("timeupdate", function(e){
  OUT.textContent = secToTimer(e.target.currentTime)
}, false)

span {font-size:4rem}

<span id="OUT"></span><br>
<video id="VIDEO" width="400" controls autoplay>
  <source src="https://www.w3schools.com/html/mov_bbb.mp4" type="video/mp4">
</video>

Поза питанням, ті функції, написані в php:

<?php 
/* HH:MM:SS to (FLOAT)seconds ------------------*/
function timerToSec($timer){
  $vtimer = explode(":",$timer);
  $vhours = (int)$vtimer[0];
  $vminutes = (int)$vtimer[1];
  $vseconds = (float)$vtimer[2];
  return $vhours * 3600 + $vminutes * 60 + $vseconds;
}
/* Seconds to (STRING)HH:MM:SS -----------------*/
function secToTimer($sec){
  return explode(" ", date("H:i:s", $sec))[0];  
}

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

Я просто хотів трохи пояснити гарну відповідь вище:

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

На другому рядку, оскільки за 1 годину припадає 3600 секунд, ми ділимо загальну кількість секунд на 3600, щоб отримати загальну кількість годин. Ми використовуємо parseInt, щоб викреслити будь-яку десяткову. Якщо totalSec склав 12600 (3 з половиною години), то parseInt (totalSec / 3600) поверне 3, оскільки у нас буде 3 повні години. Навіщо нам потрібен% 24 в цьому випадку? Якщо ми перевищимо 24 години, скажімо, у нас є 25 годин (90000 секунд), то тут модуль поверне нас до 1 знову, а не до повернення 25. Це обмежує результат протягом 24 годинного обмеження, оскільки є 24 години за один день.

Коли ви бачите щось подібне:

25 % 24

Подумайте про це так:

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

Звертаючись до цієї старої нитки - ОП заявила HH: MM: SS, і багато рішень працюють, поки ви не зрозумієте, що вам потрібно більше 24 годин у списку. І, можливо, ви не хочете більше, ніж один рядок коду. Ось вам:

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

Він повертає H +: MM: SS. Для його використання просто використовуйте:

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

... Я намагався змусити його використати якнайменшу кількість коду для приємного однолінійного підходу.

Ви намагалися додати секунди до об’єкта Дата?

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

Зразок: https://jsfiddle.net/j5g2p0dc/5/

Оновлено: зразок посилання відсутній, тому я створив нове.

Ось функція перетворення секунд у формат hh-mm-ss на основі відповіді powtac тут

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

Приклад використання

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

Переглянувши всі відповіді і не задовольнившись більшістю з них, це те, що я придумав. Я знаю, що я дуже спізнююсь до розмови, але ось це все одно.

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

Я створюю новий об'єкт "Дата", змінюю час на мої параметри, перетворюю "Об'єкт дати" в часовий рядок і видаляю додаткові речі, розбиваючи рядок і повертаючи лише ту частину, яка потрібна.

Я думав, що поділюсь цим підходом, оскільки він усуває потребу в регулярній виразці, логіці та математичній акробатиці, щоб отримати результати у форматі "HH: mm: ss", і замість цього він спирається на вбудовані методи.

Ви можете переглянути документацію тут: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date

Існує маса варіантів вирішення цієї проблеми, і очевидно, що пропонується хороший варіант, але я хочу додати ще один оптимізований код

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

якщо ви не хочете відформатованого нуля з меншим числом 10, ви можете використовувати

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

}

Приклад коду http://fiddly.org/1c476/1

В одному рядку, використовуючи рішення TJ Crowder:

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

В одному рядку ще одне рішення, яке також рахує дні:

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

Джерело: https://gist.github.com/martinbean/2bf88c446be8048814cf02b2641ba276

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

Ви також можете використовувати код нижче:

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

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

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

Для всіх, хто використовує AngularJS, простим рішенням є фільтрація значення за API дати , який перетворює мілісекунди в рядок на основі запитуваного формату. Приклад:

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

Зауважте, що це очікує мілісекунд, тому ви, можливо, захочете помножити час, залишаючись на 1000, якщо ви перетворюєте з секунд (як було сформульовано початкове запитання).

Я наткнувся на випадок, дехто згадував, де кількість секунд більше дня. Ось адаптована версія відповіді @Harish Anchu з найкращим рейтингом, що відповідає більш тривалим періодам часу:

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

Приклад:

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

Приклад використання

alert("186".toHHMMSS());

Жодна з відповідей тут не відповідає моїм вимогам, оскільки я хочу вміти впоратися

1. Велика кількість секунд (днів) та
2. Негативні числа

Незважаючи на те, що ОП не вимагає, добре висвітлювати крайові випадки, особливо коли для цього потрібно мало зусиль.

Досить очевидним є те, що ОП означає НОМЕР секунд, коли він говорить секунди . Навіщо прив’язувати вашу функцію 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

Я використовував цей код раніше, щоб створити простий об'єкт часу:

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