1

I am not sure why my time left show as NaN when I view it on

iPhone

enter image description here

Mobile Simulator in Chrome showed working

enter image description here

I even tried an experiment the same code I use in jsfiddle

https://jsfiddle.net/bheng/7w8cftyL/

It's working there too!

Does anyone else face this issue too?

Code

<div class="timeLeft"></div>




function timeDiffCalc(dateFuture, dateNow) {
    let diffInMilliSeconds = Math.abs(dateFuture - dateNow) / 1000;

    const days = Math.floor(diffInMilliSeconds / 86400);
    diffInMilliSeconds -= days * 86400;
    console.log('calculated days', days);

    const hours = Math.floor(diffInMilliSeconds / 3600) % 24;
    diffInMilliSeconds -= hours * 3600;
    console.log('calculated hours', hours);

    const minutes = Math.floor(diffInMilliSeconds / 60) % 60;
    diffInMilliSeconds -= minutes * 60;
    console.log('minutes', minutes);

    let difference = '';
    if (days > 0) {
        difference += (days === 1) ? `${days} day, ` : `${days} days, `;
    }

    difference += (hours === 0 || hours === 1) ? `${hours} hour, ` : `${hours} hours, `;

    difference += (minutes === 0 || hours === 1) ? `${minutes} minutes` : `${minutes} minutes`; 

    return difference;
}


var timeLeft = timeDiffCalc(new Date('2021-02-17 20:44:50'), new Date()); 
$('.timeLeft').text(timeLeft + " more...");
code-8
  • 54,650
  • 106
  • 352
  • 604
  • 1
    What if you run the code in desktop safari? Is it the same result there too? – evolutionxbox Feb 18 '21 at 01:30
  • Good call!, just visit this link https://www.bunlongheng.com/norden?code=l!ght on Safari, show `NaN` also. – code-8 Feb 18 '21 at 01:31
  • I think the issue is with your date format when using `new Date(...)` which can cause an issue in Safari (I'm guessing you're using Safari on the iPhone). If so, have a look at this post: https://stackoverflow.com/questions/21883699/safari-javascript-date-nan-issue-yyyy-mm-dd-hhmmss – Jayce444 Feb 18 '21 at 01:32

1 Answers1

1

Use T as indicator of time right before the time as follow

var timeLeft = timeDiffCalc(new Date('2021-02-17T20:44:50'), new Date());

You can see more date creation alternatives here in MDN: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date#several_ways_to_create_a_date_object

UPDATE:

As per the author comment, the date is given dynamicaly. To insert the mentioned T you can use string.replace as follow:

var dateStr = '2021-02-17 20:44:50';
dateStr = dateStr.replace(' ', 'T');
var timeLeft = timeDiffCalc(new Date(dateStr), new Date());
E. Mancebo
  • 629
  • 3
  • 10
  • The time was dynamically insert. I don’t think I can add the T. – code-8 Feb 18 '21 at 01:56
  • See the update @cyber8200 – E. Mancebo Feb 18 '21 at 02:06
  • See [*Why does Date.parse give incorrect results?*](https://stackoverflow.com/questions/2587345/why-does-date-parse-give-incorrect-results). A simple parse function is 2 lines of code and works reliably. – RobG Feb 18 '21 at 04:25