Skip to content Skip to sidebar Skip to footer

Changing The 1-24 Hour To 1-12 Hour For The "gethours()" Method

When I use the 'getHour()' method in javascript, it displays the military time format. I need it to display the hour in numbers between 1-12 instead. Can anybody tell me how to d

Solution 1:

Why not do it the brief way? Math, people! :)

// returns the hours number for a date, between 1 and 12functionhours12(date) { return (date.getHours() + 24) % 12 || 12; }

Solution 2:

This will correct 13 - 24 back to the range 1 - 12, and 0 back to 12:

var hours = time.getHours();
if (hours > 12) {
    hours -= 12;
} elseif (hours === 0) {
   hours = 12;
}

Also, you need to stop repeating yourself in your code. Call time.getHours() and time.getMinutes() and store their values just once each, and then worry about adding the leading zeroes, e.g.:

functionupdateclock() {

    functionpad(n) {
         return (n < 10) ? '0' + n : n;
    }

    var time = newDate();
    var hours = time.getHours();
    var minutes = time.getMinutes();

    if (hours > 12) {
        hours -= 12;
    } elseif (hours === 0) {
        hours = 12;
    }

    var todisplay = pad(hours) + ':' + pad(minutes);
    document.getElementById("clock").innerHTML = todisplay;
}

Solution 3:

functiongetClockTime(){
   var now    = newDate();
   var hour   = now.getHours();
   var minute = now.getMinutes();
   var second = now.getSeconds();
   var ap = "AM";
   if (hour   > 11) { ap = "PM";             }
   if (hour   > 12) { hour = hour - 12;      }
   if (hour   == 0) { hour = 12;             }
   if (hour   < 10) { hour   = "0" + hour;   }
   if (minute < 10) { minute = "0" + minute; }
   if (second < 10) { second = "0" + second; }
   var timeString = hour + ':' + minute + ':' + second + " " + ap;
   return timeString;
}

This Function will give the perfect time format in 1-12 hours

Solution 4:

Other answers are indeed very good. But I think, following can be included too.

var d = newDate();
var hour = d.getHours(); 
var minute = d.getMinutes();
var fulltime = "";

// create a 24 elements(0-23) array containing following valuesconst arrayHrs = [12,1,2,3,4,5,6,7,8,9,10,11,12,1,2,3,4,5,6,7,8,9,10,11];

    // since getMinutes() returns 0 to 9 for upto 9 minutes, not 00 to 09, we can do thisif(minute < 10) {
        minute = "0" + minute;
    }

    if( hour < 12) {
        // Just for an example, if hour = 11 and minute = 29
        fulltime = arrayHrs[hour] + ":" + minute + " AM"; // fulltime = 11:29 AM
    }
    else {
        // similarly, if hour = 22 and minute = 8
        fulltime = arrayHrs[hour] + ":" + minute + " PM"; // fulltime = 10:08 PM
    }

See what I did there in arrayHrs ;)

Solution 5:

Shortest:

const hours12 = date => (date.getHours() % 12  || 12);

If you need padding with 0:

const hours12 = date => ("0"+(date.getHours() % 12  || 12)).slice(-2);

Another option, also with AM & PM:

const hours12 = date => date.toLocaleString('en-US', { hour: 'numeric', hour12: true })

Post a Comment for "Changing The 1-24 Hour To 1-12 Hour For The "gethours()" Method"