Trying to add a timer to my website to countdown days

Question

I'm trying to get a timer to count down to a date by days and I don't know why this isn't working it just says NaN

function daysUntil24thApril2016() {
  var april2016 = new Date(24, 4, 2016);
  var difference = april2016.getMilliseconds - Date.now().getMilliseconds;
  return difference / 1000 / 60 / 60 / 24;
}

$(document).ready(function() {
  console.log("asdasd")
  $('#dateTime').text(daysUntil24thApril2016());
});

Possible duplicate of [How do I get the number of days between two dates in JavaScript?](http://stackoverflow.com/questions/542938/how-do-i-get-the-number-of-days-between-two-dates-in-javascript) — Jean-Baptiste Yunès, Dec 01 '15 at 10:36
I explained what went wrong with his code in my answer, so hopefully he understands how to make calculation work "his way". There might be an easier/faster way, but understanding what was wrong is the first way in getting it right. — Markus, Dec 01 '15 at 11:12

Markus · Answer 1 · 2015-12-01T11:32:18.810

There are several mistakes you made in your script, I'll try to explain each to help you understand it and finally give you a corrected script the way you wrote it:

new Date() wants the year first, then month - 1 and finally the days. So to get the 24.04.2016, you have to do new Date(2016, 3, 24)
For a Date there is a getMilliseconds function, but it returns the milliseconds part of that date, not the unix timestamp you wanted
.getTime() is the function to get the unix timestamp in milliseconds from this date
Date.now() already returns the unix timestamp (a number), there is no getMilliseconds() for that and therefore it returned undefined
Even if there were a getMilliseconds function, the way you wrote it without the braces () would not have called it anyway but returned the function. They way you wrote it resulted in var difference = function - undefined which is NaN: "Not a number".
Therefore difference was no number in your example (it was Nan) and you cannot do any math with it obviously, it stays NaN
Using Math.floor will give you full days

See below for a version of your script where the points above are corrected.

function daysUntil24thApril2016() {
  var april2016 = new Date(2016, 3, 24);
  var difference = april2016.getTime() - Date.now();
  return Math.floor(difference / 1000 / 60 / 60 / 24);
}

$(document).ready(function() {
  $('#dateTime').text(daysUntil24thApril2016());
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="dateTime"></div>

score 0 · Answer 2 · answered Dec 01 '15 at 10:31

Something like this will solve your problem:

function daysUntil24thApril2016() {
  var april2016 = new Date("2015-04-24");
  var difference = Date.now()-april2016;
  return Math.floor((difference) / (1000*60*60*24)) 
}

$(document).ready(function() {
  console.log(daysUntil24thApril2016());
});

When you subtract one Date object from another you will get the time difference in milliseconds. Using Math.floor() will return a whole (integer) number of days.

Trying to add a timer to my website to countdown days

2 Answers2