Check time difference in Javascript

Question

How would you check time difference from two text-boxes in Javascript?

Are they two text boxes containing ONLY time values? Such as "11:42pm" or "8:09am"? — Ben Torell, Nov 24 '09 at 05:47
That is answered in http://stackoverflow.com/questions/41948/how-do-i-get-the-difference-between-two-dates-in-javascript — wallyk, Nov 24 '09 at 05:14
Dates, times: they're all the same thing. Notice in the answers how they mix dates and times without caution! — wallyk, Nov 24 '09 at 05:24
http://momentjs.com/ - A javascript date library for parsing, validating, manipulating, and formatting dates. — The Demz, Feb 17 '14 at 22:10

Salman A · Answer 1 · 2014-12-13T16:29:29.677

Improvise. Subtract JavaScript Date objects to get their difference:

// use a constant date (e.g. 2000-01-01) and the desired time to initialize two dates

var date1 = new Date(2000, 0, 1,  9, 0); // 9:00 AM
var date2 = new Date(2000, 0, 1, 17, 0); // 5:00 PM

// the following is to handle cases where the times are on the opposite side of
// midnight e.g. when you want to get the difference between 9:00 PM and 5:00 AM

if (date2 < date1) {
    date2.setDate(date2.getDate() + 1);
}

var diff = date2 - date1;

// 28800000 milliseconds (8 hours)

You can then convert milliseconds to hour, minute and seconds like this:

var msec = diff;
var hh = Math.floor(msec / 1000 / 60 / 60);
msec -= hh * 1000 * 60 * 60;
var mm = Math.floor(msec / 1000 / 60);
msec -= mm * 1000 * 60;
var ss = Math.floor(msec / 1000);
msec -= ss * 1000;
// diff = 28800000 => hh = 8, mm = 0, ss = 0, msec = 0

You can convert time as string to 24-hour format like this:

function parseTime(s) {
    var part = s.match(/(\d+):(\d+)(?: )?(am|pm)?/i);
    var hh = parseInt(part[1], 10);
    var mm = parseInt(part[2], 10);
    var ap = part[3] ? part[3].toUpperCase() : null;
    if (ap === "AM") {
        if (hh == 12) {
            hh = 0;
        }
    }
    if (ap === "PM") {
        if (hh != 12) {
            hh += 12;
        }
    }
    return { hh: hh, mm: mm };
}
parseTime("12:00 AM"); // {hh:  0, mm: 0}
parseTime("12:00 PM"); // {hh: 12, mm: 0}
parseTime("01:00 PM"); // {hh: 13, mm: 0}
parseTime("23:00");    // {hh: 23, mm: 0}

I never know if dates in this format will be parsed as d/m/y or m/d/y. The official formats accepted are here (whatever Date.parse() accepts is valid), https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Date/parse — Ivan Maeder, Apr 05 '12 at 14:36
what's the +1 about here? What part of the date is that incrementing? — JonnyRaa, Jun 19 '14 at 08:13
I know this is ancient, but where in all this gibberish does anything get read from form fields? All I see is some hard-coded example code. How do I get the difference between whatever times my user typed into my two `input type="text"` boxes, rather than between 9:00 AM and 5:00 PM? — Martha, Jan 10 '15 at 01:56
@SalmanA: thanks! That's very helpful. Why did that get removed from the current revision? — Martha, Jan 10 '15 at 14:46
How do i get time diffrence between date = "2016/03/01 11:00" to date ="2016/03/06 11:00" — Vishal Singh, Feb 25 '16 at 07:29

The Demz · Answer 2 · 2013-08-07T12:38:50.620

25

This function returns a string with the difference from a datetime string and the current datetime.

function get_time_diff( datetime )
{
    var datetime = typeof datetime !== 'undefined' ? datetime : "2014-01-01 01:02:03.123456";

    var datetime = new Date( datetime ).getTime();
    var now = new Date().getTime();

    if( isNaN(datetime) )
    {
        return "";
    }

    console.log( datetime + " " + now);

    if (datetime < now) {
        var milisec_diff = now - datetime;
    }else{
        var milisec_diff = datetime - now;
    }

    var days = Math.floor(milisec_diff / 1000 / 60 / (60 * 24));

    var date_diff = new Date( milisec_diff );

    return days + " Days "+ date_diff.getHours() + " Hours " + date_diff.getMinutes() + " Minutes " + date_diff.getSeconds() + " Seconds";
}

Tested in the Google Chrome console (press F12)

get_time_diff()
1388534523123 1375877555722
"146 Days 12 Hours 49 Minutes 27 Seconds"

edited Aug 07 '13 at 12:38

answered Aug 07 '13 at 12:18

The Demz

6,796
5
36
42

How do i get time diffrence between date = "2016/03/01 11:00" to date ="2016/03/06 11:00". and also how do i formate date for above function – Vishal Singh Feb 25 '16 at 07:30
http://momentjs.com/ will solve your problems when working with time and dates in javascript – The Demz Feb 25 '16 at 12:27
1

http://momentjs.com/docs/#/displaying/difference/ Is when you need to calculate the difference between moment objects – The Demz Feb 25 '16 at 12:31

score 24 · Answer 3 · answered Aug 06 '15 at 07:13

Here's the solution that worked for me:

var date1 = new Date("08/05/2015 23:41:20");
var date2 = new Date("08/06/2015 02:56:32");

var diff = date2.getTime() - date1.getTime();

var msec = diff;
var hh = Math.floor(msec / 1000 / 60 / 60);
msec -= hh * 1000 * 60 * 60;
var mm = Math.floor(msec / 1000 / 60);
msec -= mm * 1000 * 60;
var ss = Math.floor(msec / 1000);
msec -= ss * 1000;

alert(hh + ":" + mm + ":" + ss);

score 9 · Answer 4 · answered Oct 22 '11 at 21:22

Here is my rendition....

function get_time_difference(earlierDate, laterDate) 
{
    var oDiff = new Object();

    //  Calculate Differences
    //  -------------------------------------------------------------------  //
    var nTotalDiff = laterDate.getTime() - earlierDate.getTime();

    oDiff.days = Math.floor(nTotalDiff / 1000 / 60 / 60 / 24);
    nTotalDiff -= oDiff.days * 1000 * 60 * 60 * 24;

    oDiff.hours = Math.floor(nTotalDiff / 1000 / 60 / 60);
    nTotalDiff -= oDiff.hours * 1000 * 60 * 60;

    oDiff.minutes = Math.floor(nTotalDiff / 1000 / 60);
    nTotalDiff -= oDiff.minutes * 1000 * 60;

    oDiff.seconds = Math.floor(nTotalDiff / 1000);
    //  -------------------------------------------------------------------  //

    //  Format Duration
    //  -------------------------------------------------------------------  //
    //  Format Hours
    var hourtext = '00';
    if (oDiff.days > 0){ hourtext = String(oDiff.days);}
    if (hourtext.length == 1){hourtext = '0' + hourtext};

    //  Format Minutes
    var mintext = '00';
    if (oDiff.minutes > 0){ mintext = String(oDiff.minutes);}
    if (mintext.length == 1) { mintext = '0' + mintext };

    //  Format Seconds
    var sectext = '00';
    if (oDiff.seconds > 0) { sectext = String(oDiff.seconds); }
    if (sectext.length == 1) { sectext = '0' + sectext };

    //  Set Duration
    var sDuration = hourtext + ':' + mintext + ':' + sectext;
    oDiff.duration = sDuration;
    //  -------------------------------------------------------------------  //

    return oDiff;
}

hourtext is using oDiff.days, and hours are not used to compute the duration — aguaviva, Mar 16 '17 at 18:02

score 5 · Answer 5 · edited May 21 '12 at 11:18

A good solution is avaliable at

http://blogs.digitss.com/javascript/calculate-datetime-difference-simple-javascript-code-snippet/

gives the output in your desired differnece format of

days : hours : minutes : seconds .

A slightly modified version of that code is shown below

 var vdaysdiff; // difference of the dates
   var vhourDiff;
   var vmindiff;
   var vsecdiff;

   vdaysdiff = Math.floor(diff/1000/60/60/24);  // in days
   diff -= vdaysdiff*1000*60*60*24;

   vhourDiff = Math.floor(diff/1000/60/60);  // in hours
   diff -= vhourDiff*1000*60*60;

   vmindiff = Math.floor(diff/1000/60); // in minutes
   diff -= vmindiff*1000*60;

   vsecdiff= Math.floor(diff/1000);  // in seconds

   //Text formatting
   var hourtext = '00';
   if (hourDiff > 0){ hourtext = String(hourDiff);}
   if (hourtext.length == 1){hourtext = '0' + hourtext};                                                              

   var mintext = '00';                           
   if (mindiff > 0){ mintext = String(mindiff);}
   if (mintext.length == 1){mintext = '0' + mintext};

  //shows output as HH:MM ( i needed shorter duration)
   duration.value= hourtext + ':' + mintext;

score 4 · Answer 6 · answered Sep 24 '14 at 13:06

This is an addition to dmd733's answer. I fixed the bug with Day duration (well I hope I did, haven't been able to test every case).

I also quickly added a String property to the result that holds the general time passed (sorry for the bad nested ifs!!). For example if used for UI and indicating when something was updated (like a RSS feed). Kind of out of place but nice-to-have:

function getTimeDiffAndPrettyText(oDatePublished) {

  var oResult = {};

  var oToday = new Date();

  var nDiff = oToday.getTime() - oDatePublished.getTime();

  // Get diff in days
  oResult.days = Math.floor(nDiff / 1000 / 60 / 60 / 24);
  nDiff -= oResult.days * 1000 * 60 * 60 * 24;

  // Get diff in hours
  oResult.hours = Math.floor(nDiff / 1000 / 60 / 60);
  nDiff -= oResult.hours * 1000 * 60 * 60;

  // Get diff in minutes
  oResult.minutes = Math.floor(nDiff / 1000 / 60);
  nDiff -= oResult.minutes * 1000 * 60;

  // Get diff in seconds
  oResult.seconds = Math.floor(nDiff / 1000);

  // Render the diffs into friendly duration string

  // Days
  var sDays = '00';
  if (oResult.days > 0) {
      sDays = String(oResult.days);
  }
  if (sDays.length === 1) {
      sDays = '0' + sDays;
  }

  // Format Hours
  var sHour = '00';
  if (oResult.hours > 0) {
      sHour = String(oResult.hours);
  }
  if (sHour.length === 1) {
      sHour = '0' + sHour;
  }

  //  Format Minutes
  var sMins = '00';
  if (oResult.minutes > 0) {
      sMins = String(oResult.minutes);
  }
  if (sMins.length === 1) {
      sMins = '0' + sMins;
  }

  //  Format Seconds
  var sSecs = '00';
  if (oResult.seconds > 0) {
      sSecs = String(oResult.seconds);
  }
  if (sSecs.length === 1) {
      sSecs = '0' + sSecs;
  }

  //  Set Duration
  var sDuration = sDays + ':' + sHour + ':' + sMins + ':' + sSecs;
  oResult.duration = sDuration;

  // Set friendly text for printing
  if(oResult.days === 0) {

      if(oResult.hours === 0) {

          if(oResult.minutes === 0) {
              var sSecHolder = oResult.seconds > 1 ? 'Seconds' : 'Second';
              oResult.friendlyNiceText = oResult.seconds + ' ' + sSecHolder + ' ago';
          } else { 
              var sMinutesHolder = oResult.minutes > 1 ? 'Minutes' : 'Minute';
              oResult.friendlyNiceText = oResult.minutes + ' ' + sMinutesHolder + ' ago';
          }

      } else {
          var sHourHolder = oResult.hours > 1 ? 'Hours' : 'Hour';
          oResult.friendlyNiceText = oResult.hours + ' ' + sHourHolder + ' ago';
      }
  } else { 
      var sDayHolder = oResult.days > 1 ? 'Days' : 'Day';
      oResult.friendlyNiceText = oResult.days + ' ' + sDayHolder + ' ago';
  }

  return oResult;
}

score 4 · Answer 7 · answered Mar 01 '17 at 09:25

4

The time diff in milliseconds

firstDate.getTime() - secondDate.getTime()

answered Mar 01 '17 at 09:25

score 3 · Answer 8 · answered Feb 05 '14 at 16:25

When i tried the difference between same time stamp it gave 0 Days 5 Hours 30 Minutes

so to get it exactly i have subtracted 5 hours and 30 min

function get_time_diff( datetime )
{
var datetime = typeof datetime !== 'undefined' ? datetime : "2014-01-01 01:02:03.123456";

var datetime = new Date(datetime).getTime();
var now = new Date().getTime();

if( isNaN(datetime) )
{
    return "";
}

console.log( datetime + " " + now);

if (datetime < now) {
    var milisec_diff = now - datetime;
}else{
    var milisec_diff = datetime - now;
}

var days = Math.floor(milisec_diff / 1000 / 60 / (60 * 24));

var date_diff = new Date( milisec_diff );

return days + "d "+ (date_diff.getHours() - 5) + "h " + (date_diff.getMinutes() - 30) + "m";
}

score 3 · Answer 9 · answered Sep 07 '18 at 04:12

Try This :

function SumHours() {
  var smon = document.getElementById('sMon').value ;
  var fmon = document.getElementById('fMon').value ;
  var diff = 0 ;
  if (smon && fmon) {
    smon = ConvertToSeconds(smon);
    fmon = ConvertToSeconds(fmon);
    diff = Math.abs( fmon - smon ) ;
    console.log( 'time difference is : ' + secondsTohhmmss(diff) );
  }

  function ConvertToSeconds(time) {
    var splitTime = time.split(":");
    return splitTime[0] * 3600 + splitTime[1] * 60;
  }

  function secondsTohhmmss(secs) {
    var hours = parseInt(secs / 3600);
    var seconds = parseInt(secs % 3600);
    var minutes = parseInt(seconds / 60) ;
    return hours + "hours : " + minutes + "minutes ";
  }
}

<td>
  <input type="time" class="dataInput" id="sMon" onchange="SumHours();" />
</td>

<td>
  <input type="time" class="dataInputt" id="fMon" onchange="SumHours();"/>
</td>

score 2 · Answer 10 · answered Jul 23 '17 at 02:41

I have done some enhancements for timer counter

//example return : 01:23:02:02
//               : 1 Day 01:23:02:02
//               : 2 Days 01:23:02:02 


function get_timeDifference(strtdatetime) {
    var datetime = new Date(strtdatetime).getTime();
    var now = new Date().getTime();

    if (isNaN(datetime)) {
        return "";
    }

    //console.log(datetime + " " + now);

    if (datetime < now) {
        var milisec_diff = now - datetime;
    } else {
        var milisec_diff = datetime - now;
    }

    var days = Math.floor(milisec_diff / 1000 / 60 / (60 * 24));

    var date_diff = new Date(milisec_diff);





    var msec = milisec_diff;
    var hh = Math.floor(msec / 1000 / 60 / 60);
    msec -= hh * 1000 * 60 * 60;
    var mm = Math.floor(msec / 1000 / 60);
    msec -= mm * 1000 * 60;
    var ss = Math.floor(msec / 1000);
    msec -= ss * 1000


    var daylabel = "";
    if (days > 0) {
        var grammar = " ";
        if (days > 1) grammar = "s " 
        var hrreset = days * 24;
        hh = hh - hrreset;
        daylabel = days + " Day" + grammar ;
    }


    //  Format Hours
    var hourtext = '00';
    hourtext = String(hh);
    if (hourtext.length == 1) { hourtext = '0' + hourtext };

    //  Format Minutes
    var mintext = '00';
    mintext = String(mm); 
    if (mintext.length == 1) { mintext = '0' + mintext };

    //  Format Seconds
    var sectext = '00';
    sectext = String(ss); 
    if (sectext.length == 1) { sectext = '0' + sectext };

    var msectext = '00';
    msectext = String(msec);
    msectext = msectext.substring(0, 1);
    if (msectext.length == 1) { msectext = '0' + msectext };

    return daylabel + hourtext + ":" + mintext + ":" + sectext + ":" + msectext;
}

score 1 · Answer 11 · answered May 16 '17 at 11:56

In my case, I'm gonna store the time in milliseconds on chrome storage and try to find diff in hours later.

function timeDiffInHours(milliseconds){
    time_diff = (new Date).getTime() - milliseconds
    return parseInt((time_diff/(1000*60*60)) % 24)
}

// This is again sending current time and diff would be 0.
timeDiffInHours((new Date).getTime());

score 1 · Answer 12 · answered Nov 02 '17 at 11:54

I would use just getTime(); and for example Date.now() to return difference in milliseconds:

 //specified date:

var oneDate = new Date("November 02, 2017 06:00:00");

//number of milliseconds since midnight Jan 1 1970 till specified date

var oneDateMiliseconds = oneDate.getTime();

////number of milliseconds since midnight Jan 1 1970 till now

var currentMiliseconds = Date.now(); 

//return time difference in miliseconds

alert(currentMiliseconds-oneDateMiliseconds);

score 1 · Answer 13 · answered Jan 20 '20 at 19:22

You can Get Two Time Different with this function.

 /**
     * Get Two Time Different
     * @param join
     * @param lastSeen
     * @param now
     * @returns {string}
     */
    function getTimeDiff( join, lastSeen, now = false)
    {
        let t1 = new Date(join).getTime(), t2 = new Date(lastSeen).getTime(), milliseconds =0, time ='';
        if (now) t2 = Date.now();
        if( isNaN(t1) || isNaN(t2) ) return '';
        if (t1 < t2) milliseconds = t2 - t1; else milliseconds = t1 - t2;
        var days = Math.floor(milliseconds / 1000 / 60 / (60 * 24));
        var date_diff = new Date( milliseconds );
        if (days > 0) time += days + 'd ';
        if (date_diff.getHours() > 0) time += date_diff.getHours() + 'h ';
        if (date_diff.getMinutes() > 0) time += date_diff.getMinutes() + 'm ';
        if (date_diff.getSeconds() > 0) time += date_diff.getSeconds() + 's ';
        return time;
    }
    
    
    console.log(getTimeDiff(1578852606608, 1579530945513));

score 0 · Answer 14 · edited Sep 03 '16 at 13:56

I like doing it via Epoch.

var now = new Date();
var future = new Date(now.setMinutes(15));

var futureEpoch = moment(future).unix();
var nowEpoch = moment(now).unix();
var differenceInEpoch = nowEpoch - scheduledEpoch ;

console.log("futureEpoch        : " + futureEpoch);
console.log("nowEpoch              : " + nowEpoch);
console.log("differenceInEpoch     : " + differenceInEpoch);

var diffTime = new Date(0); // The 0 there is the key, which sets the date to the epoch
diffTime.setUTCSeconds(differenceInEpoch);
console.log("new diffTime : " + diffTime);

score 0 · Answer 15 · answered Mar 27 '19 at 11:16

0

You can use moment js for this purpose. momentJs 'fromNow()' will give you any time difference from current time.

var m1 = any date time on moment format;

console.log(m1.fromNow());

answered Mar 27 '19 at 11:16

Abdus Salam Azad

4,110
40
28

score 0 · Answer 16 · answered Aug 10 '20 at 21:27

var moment = require("moment");
var momentDurationFormatSetup = require("moment-duration-format")

var now  = "2015-07-16T16:33:39.113Z";
var then = "2015-06-16T22:33:39.113Z";

var ms = moment(now,"YYYY-MM-DD'T'HH:mm:ss:SSSZ").diff(moment(then,"YYYY-MM-DD'T'HH:mm:ss:SSSZ"));
var d = moment.duration(ms);
var s = d.format("dd:hh:mm:ss");
console.log(s);

score 0 · Answer 17 · answered Oct 05 '20 at 14:11

You can set your custom difference by inserting values in end and updatedAt

getDifference(theDate: string): string {
let end = moment(moment(moment()).valueOf());
let updatedAt = moment(new Date(theDate).valueOf());
let diff = end.diff(updatedAt, "hour", false);
if (diff > 8760) {
  diff = end.diff(updatedAt, "years", false);
  return diff > 1 ? diff + " years ago" : diff + " year ago";
} else if (diff > 730) {
  diff = end.diff(updatedAt, "months", false);
  return diff > 1 ? diff + " months ago" : diff + " month ago";
} else if (diff > 24) {
  diff = end.diff(updatedAt, "days", false);
  return diff > 1 ? diff + " days ago" : diff + " day ago";
} else if (diff <= 0) {
  diff = end.diff(updatedAt, "minutes", false);
  return diff > 1 ? diff + " minutes ago" : diff + " minute ago";
} else return diff > 1 ? diff + " hours ago" : diff + " hour ago";

}

score 0 · Answer 18 · answered May 26 '21 at 15:22

get outputs like "6 hours, 23 minutes, 27 seconds", or "3 years, 5 months, 3 days, 14 hours, 3 minutes, 3 seconds".

let MILISECONDS = 1000
let YEAR_IN_SECONDS = 31536000
let MONTHS_IN_SECONDS = 2592000
let DAY_IN_SECONDS = 86400
let HOUR_IN_SECONDS = 3600
let MINUTES_IN_SECONDS = 60

let TIME_LENGTHS = [
  {seconds: YEAR_IN_SECONDS, term: 'years'},
  {seconds: MONTHS_IN_SECONDS, term: 'months'},
  {seconds: DAY_IN_SECONDS, term: 'days'},
  {seconds: HOUR_IN_SECONDS, term: 'hours'},
  {seconds: MINUTES_IN_SECONDS, term: 'minutes'},
  {seconds: 1, term: 'seconds'}
]
  const timeInUnitsFormat = function (start) {
  let messageJoins = []
  let now = new Date()
  let diffInSeconds = parseInt((now.getTime() - start.getTime()) / MILISECONDS)
  for (let tl of TIME_LENGTHS) {
    if (diffInSeconds >= tl.seconds) {
      let num_of_times = diffInSeconds / tl.seconds
      diffInSeconds = diffInSeconds % tl.seconds
      messageJoins.push(`${num_of_times} ${tl.term}`)
    }
  }
  return messageJoins.join(',')
}

Mohsin Shoukat · Answer 19 · 2019-06-18T09:28:13.830

-5

grab the input values after form submission in php

$start_time = $_POST('start_time');
$end_time =$_POST('end_time');
$start = $start_time;
$end = $end_time;
$datetime1 = new DateTime($end);
$datetime2 = new DateTime($start);
//echo $datetime1->format('H:i:s');
$interval = $datetime1->diff($datetime2);
$elapsed = $interval->format('%h:%i');
$time = explode(":",$elapsed);
$hours = $time[0];
$minutes = $time[1];
$tminutes = $minutes + ($hours*60);

the variable $tminutes is total diff in minutes , working hour is $hour . this code is for php use this logic and convert this code to js

edited Jun 18 '19 at 09:28

answered Mar 01 '17 at 08:15

Mohsin Shoukat

1,070
1
12
20

what error you are facing , it's working fine for me ! – Mohsin Shoukat Mar 01 '17 at 09:23
Question author want to know how to do it in js, so em i. – Arek Kostrzeba Mar 15 '17 at 10:49

Check time difference in Javascript

19 Answers19

Linked

Related