it-swarm.com.de

Wie wird JavaScript-Datumszeit im 12-Stunden-Format angezeigt?

Wie wird ein JavaScript-Datetime-Objekt im 12-Stunden-Format (AM/PM) angezeigt?

223
bbrame

function formatAMPM(date) {
  var hours = date.getHours();
  var minutes = date.getMinutes();
  var ampm = hours >= 12 ? 'pm' : 'am';
  hours = hours % 12;
  hours = hours ? hours : 12; // the hour '0' should be '12'
  minutes = minutes < 10 ? '0'+minutes : minutes;
  var strTime = hours + ':' + minutes + ' ' + ampm;
  return strTime;
}

console.log(formatAMPM(new Date));

395
bbrame

Wenn Sie nur die Stunden anzeigen möchten, dann ..

var time = new Date();
console.log(
  time.toLocaleString('en-US', { hour: 'numeric', hour12: true })
);  

Ausgabe: 7 Uhr

Wenn Sie auch die Minuten anzeigen möchten, dann ...

var time = new Date();
console.log(
  time.toLocaleString('en-US', { hour: 'numeric', minute: 'numeric', hour12: true })
);

Ausgabe: 7:23 Uhr

122
Abhay Kumar

Sie können auch etwas wie date.js verwenden:

<html>
<script type="text/javascript" src="http://www.datejs.com/build/date.js"></script>

<script>
   (function ()
   {
      document.write(new Date().toString("hh:mm tt"));
   })();
</script>
</html>

48

Hier ist eine Möglichkeit mit Regex:

console.log(new Date('7/10/2013 20:12:34').toLocaleTimeString().replace(/([\d]+:[\d]{2})(:[\d]{2})(.*)/, "$1$3"))
console.log(new Date('7/10/2013 01:12:34').toLocaleTimeString().replace(/([\d]+:[\d]{2})(:[\d]{2})(.*)/, "$1$3"))

Dadurch werden 3 übereinstimmende Gruppen erstellt:

  • ([\d]+:[\d]{2}) - Stunde: Minute
  • (:[\d]{2}) - Sekunden
  • (.*) - Raum und Zeitraum (Zeitraum ist der offizielle Name für AM/PM)

Dann werden die 1. und 3. Gruppe angezeigt.

WARNUNG: toLocaleTimeString () kann sich je nach Region/Standort anders verhalten.

37
Steve Tauber

Wenn Sie die am/pm nicht ausdrucken müssen, habe ich folgendes Nizza und prägnant gefunden: 

var now = new Date();
var hours = now.getHours() % 12 || 12;  // 12h instead of 24h, with 12 instead of 0. 

Dies basiert auf der Antwort von @ bbrame. 

31
rattray

Mein Vorschlag ist, den Moment js für Datum und Uhrzeit zu verwenden.

https://momentjs.com/docs/#/displaying/format/

console.log(moment().format('hh:mm a'));
<script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.17.1/moment.min.js"></script>
12
Vijay Maheriya

benutze dateObj.toLocaleString([locales[, options]])

Option 1 - Verwenden von Gebietsschemas

var date = new Date();
console.log(date.toLocaleString('en-US'));

Option 2 - Optionen verwenden

var options = { hour12: true };
console.log(date.toLocaleString('en-GB', options));

Hinweis: wird von allen Browsern unterstützt, jedoch nicht von Safari atm

10
LiranBo

Soweit ich weiß, ist der beste Weg, dies ohne Erweiterungen und komplexe Codierungen zu erreichen, folgendermaßen:

     date.toLocaleString([], { hour12: true});

Javascript AM/PM Format

<!DOCTYPE html>
<html>
<body>
    <p>Click the button to display the date and time as a string.</p>

    <button onclick="myFunction()">Try it</button>
    <button onclick="fullDateTime()">Try it2</button>
    <p id="demo"></p>
    <p id="demo2"></p>
    <script>
        function myFunction() {
            var d = new Date();
            var n = d.toLocaleString([], { hour: '2-digit', minute: '2-digit' });
            document.getElementById("demo").innerHTML = n;
        }
        function fullDateTime() {
            var d = new Date();          
            var n = d.toLocaleString([], { hour12: true});
            document.getElementById("demo2").innerHTML = n;
        }
    </script>
</body>
</html>

Ich fand das, als ich diese Frage überprüfte.

Wie verwende ich .toLocaleTimeString () ohne Sekundenanzeige?

9
Edwin Mendez

Kurzer RegExp für en-US:

var d = new Date();
d = d.toLocaleTimeString().replace(/:\d+ /, ' '); // current time, e.g. "1:54 PM"
8
Geo

Die Lösung finden Sie unten

var d = new Date();
var amOrPm = (d.getHours() < 12) ? "AM" : "PM";
var hour = (d.getHours() < 12) ? d.getHours() : d.getHours() - 12;
return   d.getDate() + ' / ' + d.getMonth() + ' / ' + d.getFullYear() + ' ' + hour + ':' + d.getMinutes() + ' ' + amOrPm;

Check out Datejs . Ihre eingebauten Formatierer können dies tun: http://code.google.com/p/datejs/wiki/APIDocumentation#toString

Es ist eine wirklich praktische Bibliothek, besonders wenn Sie andere Dinge mit Datumsobjekten planen.

4
Chris Laplante

Ich behaupte, es ist hier es funktioniert gut.

var date_format = '12'; /* FORMAT CAN BE 12 hour (12) OR 24 hour (24)*/


var d       = new Date();
var hour    = d.getHours();  /* Returns the hour (from 0-23) */
var minutes     = d.getMinutes();  /* Returns the minutes (from 0-59) */
var result  = hour;
var ext     = '';

if(date_format == '12'){
    if(hour > 12){
        ext = 'PM';
        hour = (hour - 12);

        if(hour < 10){
            result = "0" + hour;
        }else if(hour == 12){
            hour = "00";
            ext = 'AM';
        }
    }
    else if(hour < 12){
        result = ((hour < 10) ? "0" + hour : hour);
        ext = 'AM';
    }else if(hour == 12){
        ext = 'PM';
    }
}

if(minutes < 10){
    minutes = "0" + minutes; 
}

result = result + ":" + minutes + ' ' + ext; 

console.log(result);

und plunker beispiel hier

3
<script>
var todayDate = new Date();
var getTodayDate = todayDate.getDate();
var getTodayMonth =  todayDate.getMonth()+1;
var getTodayFullYear = todayDate.getFullYear();
var getCurrentHours = todayDate.getHours();
var getCurrentMinutes = todayDate.getMinutes();
var getCurrentAmPm = getCurrentHours >= 12 ? 'PM' : 'AM';
getCurrentHours = getCurrentHours % 12;
getCurrentHours = getCurrentHours ? getCurrentHours : 12; 
getCurrentMinutes = getCurrentMinutes < 10 ? '0'+getCurrentMinutes : getCurrentMinutes;
var getCurrentDateTime = getTodayDate + '-' + getTodayMonth + '-' + getTodayFullYear + ' ' + getCurrentHours + ':' + getCurrentMinutes + ' ' + getCurrentAmPm;
alert(getCurrentDateTime);
</script>
3
Pankaj Upadhyay

Hier ist ein anderer Weg, der einfach und sehr effektiv ist:

        var d = new Date();

        var weekday = new Array(7);
        weekday[0] = "Sunday";
        weekday[1] = "Monday";
        weekday[2] = "Tuesday";
        weekday[3] = "Wednesday";
        weekday[4] = "Thursday";
        weekday[5] = "Friday";
        weekday[6] = "Saturday";

        var month = new Array(11);
        month[0] = "January";
        month[1] = "February";
        month[2] = "March";
        month[3] = "April";
        month[4] = "May";
        month[5] = "June";
        month[6] = "July";
        month[7] = "August";
        month[8] = "September";
        month[9] = "October";
        month[10] = "November";
        month[11] = "December";

        var t = d.toLocaleTimeString().replace(/:\d+ /, ' ');

        document.write(weekday[d.getDay()] + ',' + " " + month[d.getMonth()] + " " + d.getDate() + ',' + " " + d.getFullYear() + '<br>' + d.toLocaleTimeString());

    </script></div><!-- #time -->
2
user3059774

mit diesem einfachen Code können Sie am oder pm bestimmen

var today=new Date();
var noon=new Date(today.getFullYear(),today.getMonth(),today.getDate(),12,0,0);
var ampm = (today.getTime()<noon.getTime())?'am':'pm';
1
sarkiroka

Verwenden Sie dazu Moment.js

Verwenden Sie die folgenden Codes in JavaScript, wenn Sie moment.js verwenden

H, HH       24 hour time
h, or hh    12 hour time (use in conjunction with a or A)

Die format()-Methode gibt das Datum in einem bestimmten Format zurück.

moment(new Date()).format("YYYY-MM-DD HH:mm"); // 24H clock
moment(new Date()).format("YYYY-MM-DD hh:mm A"); // 12H clock (AM/PM)
moment(new Date()).format("YYYY-MM-DD hh:mm a"); // 12H clock (am/pm)
0
Ankur Mahajan

Hier meine Lösung

function getTime() {

var systemDate = new Date();
var hours = systemDate.getHours();
var minutes = systemDate.getMinutes();

var ampm;
if (hours >= 12) {
    ampm = "PM";
} else {
    ampm = "AM";
}

hours = hours % 12;

if (hours == 0) {
    hours = 12;
}

_hours = checkTimeAddZero(hours);
_minutes = checkTimeAddZero(minutes);
console.log(_hours + ":" + _minutes + " " + ampm);

}

function checkTimeAddZero(i) {
if (i < 10) {
    i = "0" + i
}
return i;

}

0
Prathamesh More
<h1 id="clock_display" class="text-center" style="font-size:40px; color:#ffffff">[CLOCK TIME DISPLAYS HERE]</h1>



<script>
            var AM_or_PM = "AM";

            function startTime(){

                var today = new Date();
                var h = today.getHours();
                var m = today.getMinutes();
                var s = today.getSeconds();

                h = twelve_hour_time(h);
                m = checkTime(m);
                s = checkTime(s);



                document.getElementById('clock_display').innerHTML =
                    h + ":" + m + ":" + s +" "+AM_or_PM;
                var t = setTimeout(startTime, 1000);

            }

            function checkTime(i){

                if(i < 10){
                    i = "0" + i;// add zero in front of numbers < 10
                }
                return i;
            }

            // CONVERT TO 12 HOUR TIME. SET AM OR PM
            function twelve_hour_time(h){

                if(h > 12){
                    h = h - 12;
                    AM_or_PM = " PM";
                }
                return h;

            }

            startTime();

        </script>
0
Stnfordly

var d = new Date();
var hours = d.getHours() % 12;
  hours = hours ? hours : 12;
    var test = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'][(d.getMonth() + 1)] + " " + 
    ("00" + d.getDate()).slice(-2) + " " + 
    d.getFullYear() + " " + 
    ("00" + hours).slice(-2) + ":" + 
    ("00" + d.getMinutes()).slice(-2) + ":" + 
    ("00" + d.getSeconds()).slice(-2) + ' ' + (d.getHours() >= 12 ? 'PM' : 'AM'); 
    
document.getElementById("demo").innerHTML = test;
<p id="demo" ></p>

0
sujithklr93