How to convert 24 hours time format to 12 hours with AM or PM using javascript

I have requirement if countdown timer in my project so I am using code for that but that code showing 24 hrs format but i want 12 hours format with AM or PM should show instead of 13,14,15 I want hours should come like this 1:00 PM,2:00 PM,3:00 PM.any idea how to do this ?

<p id="check_time"></p>
<p id="check_hours"></p>

<script>

var countDownDate = new Date("may 17, 2018 01:37:25").getTime();  //this the which i have to count for difference


var x = setInterval(function() {


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


    var distance = countDownDate - now;


    var days = Math.floor(distance / (1000 * 60 * 60 * 24));
    var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));

    var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
    var seconds = Math.floor((distance % (1000 * 60)) / 1000);

    document.getElementById("check_hours").innerHTML = hours;

    document.getElementById("check_time").innerHTML = days + "d " + hours + "h "
    + minutes + "m " + seconds + "s ";


    if (distance < 0) {
        clearInterval(x);
        document.getElementById("demo").innerHTML = "EXPIRED";
    }
}, 1000);
</script>

1 answer

  • answered 2018-05-16 07:22 Mamun

    Try the following:

    var countDownDate = new Date("may 17, 2018 01:37:25").getTime();  //this the which i have to count for difference
    
    var x = setInterval(function() {
        var now = new Date().getTime();
        var distance = countDownDate - now;
        var days = Math.floor(distance / (1000 * 60 * 60 * 24));
        var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
        var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
        var seconds = Math.floor((distance % (1000 * 60)) / 1000);
        
        var n = new Date();
        var min = n.getMinutes() < 10 ? '0' + n.getMinutes() : n.getMinutes();
        var sec = n.getSeconds() < 10 ? '0' + n.getSeconds() : n.getSeconds();
    
        var time = n.getHours() + ':' + min + ':' + sec;
        document.getElementById("check_hours").innerHTML = tConvert(time);
        document.getElementById("check_time").innerHTML = days + "d " + hours + "h "
        + minutes + "m " + seconds + "s ";
    
    
        if (distance < 0) {
          clearInterval(x);
          document.getElementById("demo").innerHTML = "EXPIRED";
        }
    }, 1000);
    
    function tConvert (time) {
     // Check correct time format and split into components
     time = time.toString ().match (/^([01]\d|2[0-3])(:)([0-5]\d)(:[0-5]\d)?$/) || [time];
    
      if (time.length > 1) { // If time format correct
        time = time.slice (1);  // Remove full string match value
        time[5] = +time[0] < 12 ? ' AM' : ' PM'; // Set AM/PM
        time[0] = +time[0] % 12 || 12; // Adjust hours
      }
      return time.join (''); // return adjusted time or original string
    }
    <p id="check_time"></p>
    <p id="check_hours"></p>