CODEWITHSUNDEEP
javascripthtmldatetime
Vinny
Vinny

Reputation: 75

Javascript time function not displaying correctly

I have a function to display the time from javascript with a two minute delay. The only problem is that when the time is for example, 2:00pm, the function displays 2:0-2pm instead of 1:58pm.

Here is the code below:

    function startTime() {
    var today = new Date();
    var h = today.getHours();
    var m = eval(today.getMinutes()-2); // needs eval function
    var s = today.getSeconds();
    m = checkTime(m);
    s = checkTime(s);
    var time = h>=12?" PM":" AM" // am or pm
    h = h % 12;
    h = h ? h : 12; // the hour '0' should be '12'
    m = m < 10 ? ''+m : m;
    
    document.getElementById('txt').innerHTML =
    "Time: " + h + ":" + m + ":" + s + time;
    var t = setTimeout(startTime, 500);
    
    }
    function checkTime(i) {
    if (i < 10) {i =  "0" + i}; // add zero in front of numbers < 10
    return i;
    }
    
    <body onload="startTime()">
    <div id="txt"></div>

Upvotes: 0

Views: 183

Answers (2)

RobG
RobG

Reputation: 147353

Your problem is that you're subtracting 2 minutes without considering that you're dealing with time, not just numbers. Also, your function can be a lot more concise.

A simple solution is to subtract 2 minutes from the date before formatting it. That will also adjust the hours and allow for daylight saving where it's observed. Where the changeover time is 02:00 and going into daylight saving, 2 minutes before 03:00 is 01:58. Similarly when coming out of daylight saving.

Consider:

function get2MinsAgo() {
  function z(n){return (n<10? '0' : '') + n}
  var d = new Date();
  d.setMinutes(d.getMinutes() - 2);
  return (d.getHours() % 12 || 12) + ':' +
         z(d.getMinutes()) + ':' +
         z(d.getSeconds()) + ' ' +
         (d.getHours() < 12? 'AM' : 'PM');
}

function showTime(){
  // Run just after next full second
  var lag = 1020 - new Date()%1000;
  document.getElementById('timeText').textContent = get2MinsAgo();
  setTimeout(showTime, lag);
}

showTime()
<div>Two minutes ago was <span id="timeText"></span></div>

Upvotes: 1

Casper-Evil
Casper-Evil

Reputation: 31

I suspect that it is because at 2:00pm or any time on the hour the "getMinutes()" function will return with 00 minutes. So that when you subtract two from that it sets itself to -2 rather than 58.

Upvotes: 1

Related Questions