wake-up-neo.com

24 Stunden in 12 Stunden mit AM & konvertieren PM mit Javascript

Wie kann der folgende JSON-Wert am besten von einem 24-Stunden-Format in ein 12-Stunden-Format mit AM & PM konvertiert werden? Das Datum sollte gleich bleiben - nur die Uhrzeit muss formatiert werden.

February 04, 2011 19:00:00

P.S. Verwenden Sie jQuery, wenn es das einfacher macht! Würde auch eine einfache Funktion/Code bevorzugen und Date.js. nicht verwenden.

52
Slythic

UPDATE 2: ohne Sekundenoption

UPDATE: AM nach Mittag korrigiert, getestet: http://jsfiddle.net/aorcsik/xbtjE/

Ich habe diese Funktion dafür erstellt:

function formatDate(date) {
  var d = new Date(date);
  var hh = d.getHours();
  var m = d.getMinutes();
  var s = d.getSeconds();
  var dd = "AM";
  var h = hh;
  if (h >= 12) {
    h = hh - 12;
    dd = "PM";
  }
  if (h == 0) {
    h = 12;
  }
  m = m < 10 ? "0" + m : m;

  s = s < 10 ? "0" + s : s;

  /* if you want 2 digit hours:
  h = h<10?"0"+h:h; */

  var pattern = new RegExp("0?" + hh + ":" + m + ":" + s);

  var replacement = h + ":" + m;
  /* if you want to add seconds
  replacement += ":"+s;  */
  replacement += " " + dd;

  return date.replace(pattern, replacement);
}

alert(formatDate("February 04, 2011 12:00:00"));

62
aorcsik

So können Sie die Stunden ohne if-Anweisung ändern:

hours = ((hours + 11) % 12 + 1);
87
TomTom
    //it is pm if hours from 12 onwards
    suffix = (hours >= 12)? 'pm' : 'am';

    //only -12 from hours if it is greater than 12 (if not back at mid night)
    hours = (hours > 12)? hours -12 : hours;

    //if 00 then it is 12 am
    hours = (hours == '00')? 12 : hours;
34
user1365977

Für alle, die NUR die Uhrzeit in der Ausgabe wünschen, können Sie Optionen an die Date :: toLocaleString () - Methode von JavaScript übergeben. Beispiel:

var date = new Date("February 04, 2011 19:00:00");
var options = {
  hour: 'numeric',
  minute: 'numeric',
  hour12: true
};
var timeString = date.toLocaleString('en-US', options);
console.log(timeString);

timeString wird gesetzt auf:

8:00 UHR MORGENS

Fügen Sie "second: 'numeric" "zu Ihren Optionen hinzu, wenn auch Sekunden gewünscht werden. Für alle Optionen siehe this .

14
Vern Jensen

Hier ist ein recht knappes Verfahren, um einen Prototyp zu verwenden:

 Date.prototype.getFormattedTime = function () {
 var hours = this.getHours () == 0? "12": this.getHours ()> 12? this.getHours () - 12: this.getHours (); 
 var minutes = (this.getMinutes () <10? "0": "") + this.getMinutes (); 
 var ampm = this.getHours () <12? "AM": "PM"; 
 var formatierteZeit = Stunden + ":" + Minuten + "" + ampm; 
 return formatierteZeit; 
} 

Dann müssen Sie nur noch Ihren String-Wert in ein Datum konvertieren und die neue Methode verwenden:

 var stringValue = "04. Februar 2011 19:00:00; 
 var dateValue = neues Datum (stringValue); 
 var formattedTime = dateValue.getFormattedTime ();.

Oder in einer einzigen Zeile:

 var formatattedTime = neues Datum ("04. Februar 2011 19:00:00"). getFormattedTime (); 
6
wloescher

Halte es einfach und sauber

var d = new Date();
var n = d.toLocaleString();

https://jsfiddle.net/rinu6200/3dkdxaad/#base

4
rinu mv

function pad(num) {return ("0" + num).slice(-2);}
function time1() {
  var today = new Date(),
    h = today.getHours(),
    m = today.getMinutes(),
    s = today.getSeconds();
    
  h = h % 12;
  h = h ? h : 12; // the hour '0' should be '12'
  clk.innerHTML = h + ':' + 
    pad(m) + ':' + 
    pad(s) + ' ' + 
    (h >= 12 ? 'PM' : 'AM');
}
window.onload = function() {
  var clk = document.getElementById('clk');
  t = setInterval(time1, 500);
}
<span id="clk"></span>

4
Prafulla

jQuery hat überhaupt keine Date-Dienstprogramme. Wenn Sie keine zusätzlichen Bibliotheken verwenden, erstellen Sie normalerweise ein JavaScript-Objekt Date, extrahieren Sie die Daten und formatieren Sie sie selbst.

Zum Erstellen des Date-Objekts können Sie entweder sicherstellen, dass Ihre Datumszeichenfolge in der JSON in einer Form vorliegt, die von Date verstanden wird. Dies ist der IETF-Standard (im Wesentlichen RFC 822 Abschnitt 5 ). Wenn Sie also die Möglichkeit haben, Ihre JSON zu ändern, wäre dies am einfachsten. (BEARBEITEN: Ihr Format funktioniert möglicherweise so, wie es ist.)

Wenn Sie Ihre JSON nicht ändern können, müssen Sie die Zeichenfolge selbst analysieren und Tag, Mund, Jahr, Stunden, Minuten und Sekunden als Ganzzahlen angeben und das Date-Objekt damit erstellen.

Sobald Sie Ihr Date-Objekt haben, müssen Sie die benötigten Daten extrahieren und formatieren:

   var myDate = new Date("4 Feb 2011, 19:00:00");
   var hours = myDate.getHours();
   var am = true;
   if (hours > 12) {
      am = false;
      hours -= 12;
   } else (hours == 12) {
      am = false;
   } else (hours == 0) {
      hours = 12;
   }

   var minutes = myDate.getMinutes();
   alert("It is " + hours + " " + (am ? "a.m." : "p.m.") + " and " + minutes + " minutes".);
3
RoToRa

1) "Quadratische" Anweisungen für die Erstellung von 24 Stunden wurden zu 12 Stunden:

var hours24 = new Date().getHours(); // retrieve current hours (in 24 mode)
var dayMode = hours24 < 12 ? "am" : "pm"; // if it's less than 12 then "am"
var hours12 = hours24 <= 12 ? (hours24 == 0 ? 12 : hours24) : hours24 - 12;
// "0" in 24-mode now becames "12 am" in 12-mode – thanks to user @Cristian
document.write(hours12 + " " + dayMode); // printing out the result of code

2) In einer einzelnen Zeile (gleiches Ergebnis mit leicht abweichendem Algorithmus):

var str12 = (h24 = new Date().getHours()) && (h24 - ((h24 == 0)? -12 : (h24 <= 12)? 0 : 12)) + (h24 < 12 ? " am" : " pm");

Beide Optionen geben einen String zurück, wie "5 pm" oder "10 am" usw.

2
date = date.replace(/[0-9]{1,2}(:[0-9]{2}){2}/, function (time) {
    var hms = time.split(':'),
        h = +hms[0],
        suffix = (h < 12) ? 'am' : 'pm';
    hms[0] = h % 12 || 12;        
    return hms.join(':') + suffix
});

edit: Ich habe vergessen, mit 12 Uhr am/pm umzugehen. Fest.

2

Sie können einen Blick auf this werfen. Eines der Beispiele sagt:

var d = new Date(dateString);

Sobald Sie ein Date-Objekt haben, können Sie ziemlich leicht damit spielen. Sie können entweder toLocaleDateString oder toLocaleTimeString aufrufen oder testen, ob getHours größer als 12 ist, und dann die AM/PM-Zeit berechnen.

2
MeanEYE
 function GetTime(date) {
        var currentTime = (new Date(date))
        var hours = currentTime.getHours()
        //Note: before converting into 12 hour format
        var suffix = '';
        if (hours > 11) {
            suffix += "PM";
        } else {
            suffix += "AM";
        }
        var minutes = currentTime.getMinutes()
        if (minutes < 10) {
            minutes = "0" + minutes
        }
        if (hours > 12) {
            hours -= 12;
        } else if (hours === 0) {
            hours = 12;
        }
        var time = hours + ":" + minutes + " " + suffix;
        return time;
    }
1
aamir sajjad

Ich bin ein relativer Neuling, aber ich habe mir eines meiner eigenen Projekte ausgedacht und es scheint zu funktionieren. Möglicherweise gibt es einfachere Möglichkeiten, dies zu tun.

function getTime() {
    var nowTimeDate = new Date();
    var nowHour = nowTimeDate.getHours();
    var nowMinutes = nowTimeDate.getMinutes();
    var suffix = nowHour >= 12 ? "pm" : "am";
    nowHour = (suffix == "pm" & (nowHour > 12 & nowHour < 24)) ? (nowHour - 12) : nowHour;
    nowHour = nowHour == 0 ? 12 : nowHour;
    nowMinutes = nowMinutes < 10 ? "0" + nowMinutes : nowMinutes;
    var currentTime = nowHour + ":" + nowMinutes + suffix;
    document.getElementById("currentTime").innerHTML = currentTime;
}
1
Dave Irwin
var dt = new Date();
    var h =  dt.getHours(), m = dt.getMinutes();
    var thistime = (h > 12) ? (h-12 + ':' + m +' PM') : (h + ':' + m +' AM');
console.log(thistime);

Hier ist die Demo

1
Muhammad Tahir

Bitte versuchen Sie es mit dem folgenden Code

var s = "15 Feb 2015 11.30 a.m";
        var times = s.match("((([0-9])|([0-2][0-9])).([0-9][0-9])[\t ]?((a.m|p.m)|(A.M|P.M)))");            
        var time = "";

        if(times != null){                          
            var hour = times[2];
            if((times[6] == "p.m" || times[6] == "P.M")){
                if(hour < 12){
                    hour = parseInt(hour) + parseInt(12);
                }else if(hour == 12){
                    hour = "00";
                }
            }
            time = [hour, times[5], "00"].join(":");

        }

Vielen Dank

1

Das hat für mich funktioniert!

function main() {
  var time = readLine();
  var formattedTime = time.replace('AM', ' AM').replace('PM', ' PM');
  var separators = [':', ' M'];
  var hms = formattedTime.split(new RegExp('[' + separators.join('') + ']'));
  if (parseInt(hms[0]) < 12 && hms[3] == 'P')
      hms[0] = parseInt(hms[0]) + 12;
  else if (parseInt(hms[0]) == 12 && hms[3] == 'A')
      hms[0] = '00';
  console.log(hms[0] + ':' + hms[1] + ':' + hms[2]);

}
1
Ishu nanda

dies ist Ihr HTML-Code, mit dem Sie die Funktion aufrufen, um das 24-Stunden-Format mit am/pm in 12 Stunden umzuwandeln 

<pre id="tests" onClick="tConvert('18:00:00')">
  test on click 18:00:00
</pre>
<span id="rzlt"></span>

schreibe diese tConvert-Funktion jetzt in js-Code so, wie sie ist 

 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; // return adjusted time or original string
      var tel = document.getElementById ('rzlt');
      
      tel.innerHTML= time.join ('');
  }

konvertierung von 18:00 bis 6:00:00 für mich arbeiten 

1
Mohsin Shoukat

Diese Funktion konvertiert in beide Richtungen: 12 bis 24 Stunden oder 24 bis 12 Stunden

function toggle24hr(time, onoff){
    if(onoff==undefined) onoff = isNaN(time.replace(':',''))//auto-detect format
    var pm = time.toString().toLowerCase().indexOf('pm')>-1 //check if 'pm' exists in the time string
    time = time.toString().toLowerCase().replace(/[ap]m/,'').split(':') //convert time to an array of numbers
    time[0] = Number(time[0])
    if(onoff){//convert to 24 hour:
        if((pm && time[0]!=12)) time[0] += 12
        else if(!pm && time[0]==12) time[0] = '00'  //handle midnight
        if(String(time[0]).length==1) time[0] = '0'+time[0] //add leading zeros if needed
    }else{ //convert to 12 hour:
        pm = time[0]>=12
        if(!time[0]) time[0]=12 //handle midnight
        else if(pm && time[0]!=12) time[0] -= 12
    }
    return onoff ? time.join(':') : time.join(':')+(pm ? 'pm' : 'am')
}

Hier sind einige Beispiele:

//convert to 24 hour:
toggle24hr('12:00am')   //returns 00:00
toggle24hr('2:00pm')    //returns 14:00
toggle24hr('8:00am')    //returns 08:00
toggle24hr('12:00pm')   //returns 12:00

//convert to 12 hour:
toggle24hr('14:00')    //returns 2:00pm
toggle24hr('08:00')    //returns 8:00am
toggle24hr('12:00')    //returns 12:00pm
toggle24hr('00:00')    //returns 12:00am

//you can also force a specific format like this:
toggle24hr('14:00',1)    //returns 14:00
toggle24hr('14:00',0)    //returns 2:00pm
0
cronoklee

Sie werden sowieso eine Menge String-Manipulationen durchführen, Warum also nicht einfach den Datums-String selbst manipulieren?

Browser formatieren die Datumszeichenfolge anders.

Netscape ::: Fri May 11 2012 20:15:49 GMT-0600 (Tageslichtzeit in den Bergen)

IE ::: Fri May 11 20:17:33 MDT 2012 

also musst du das überprüfen. 

var D = new Date().toString().split(' ')[(document.all)?3:4];

Damit wird D gleich der 24-Stunden-Zeichenfolge HH: MM: SS. Teilen Sie das auf den Doppelpunkt auf. Das erste Element sind die Stunden.

var H = new Date().toString().split(' ')[(document.all)?3:4].split(':')[0];

Sie can konvertieren 24 Stunden in 12 Stunden, aber das wurde nicht wirklich erwähnt. Wahrscheinlich, weil es ziemlich VERRÜCKT ist, was Sie eigentlich mathematisch tun, wenn Sie die Stunden aus Uhr umrechnen. In der Tat fügen Sie 23 hinzu, modieren dasby 12 und fügen 1 hinzu

twelveHour = ((twentyfourHour+23)%12)+1;

So können Sie zum Beispiel die gesamte Zeit aus der Datumszeichenfolge, mod Der Stunden, ziehen und alles mit den neuen Stunden anzeigen.

var T = new Date().toString().split(' ')[(document.all)?3:4].split(':');
T[0] = (((T[0])+23)%12)+1;
alert(T.join(':'));

Mit etwas intelligentem Regex können Sie die Stunden wahrscheinlich aus dem Teil HH: MM: SS Der Datumszeichenfolge ziehen und alle in derselben Zeile modifizieren. Es wäre eine lächerliche Linie, da die Rückverweisung $ 1 nicht in Berechnungen verwendet werden kann, ohne dass eine Funktion in die Ersetzung gesetzt wird.

So würde das aussehen:

var T = new Date().toString().split(' ')[(document.all)?3:4].replace(/(^\d\d)/,function(){return ((parseInt(RegExp.$1)+23)%12)+1} );

Was, wie gesagt, lächerlich ist. Wenn Sie eine Bibliothek verwenden, die CAN-Berechnungen für Rückreferenzen ausführen kann, wird die Zeile wie folgt:

var T = new Date().toString().split(' ')[(document.all)?3:4].replace(/(^\d\d)/, (($1+23)%12)+1);

Und das kommt eigentlich nicht als brauchbarer Code in Frage, wenn Sie es gut dokumentieren ... Diese Zeile sagt:

Erstellen Sie eine Datumszeichenfolge, teilen Sie sie in die Leerzeichen auf, und erhalten Sie den Browser-Propan-Teil. und ersetzen Sie die erste zweistellige Nummer durch diese modifizierte Nummer.

Punkt der Geschichte ist, wie man 24-Stunden-Stunden in 12-Stunden-Stunden umwandeltist eine nicht nahe liegende mathematische Berechnung:

Sie addieren 23, mod durch 12 und fügen dann eine weitere hinzu.

0
2strokeMotor

Hier ist eine nette kleine Funktion, die für mich funktioniert hat.

function getDisplayDatetime() {
    var d = new Date(); var hh = d.getHours(); var mm = d.getMinutes(); var dd = "AM"; var h = hh;

    if (mm.toString().length == 1) {
        mm = "0" + mm;
    }

    if (h >= 12) {
        h = hh - 12;
        dd = "PM";
    }

    if (h == 0) {
        h = 12;
    }
    var Datetime = "Datetime: " + d.getFullYear() + "/" + (d.getMonth() + 1) + "/" + d.getUTCDate() + " " + h + ":" + mm;
    return Datetime + " " + dd;
}
0
Steven

Bitte schön

var myDate = new Date("February 04, 2011 19:00:00");
var hr = myDate.getHours(); 
var convHrs = "";
var ampmSwitch = "";
ampmSwitch = (hr > 12)? "PM":"AM"; 
convHrs = (hr >12)? hr-12:hr;
// Build back the Date / time using getMonth/ getFullYear and getDate and other functions on the myDate object. Enclose it inside a func and there you got the working 12 hrs converter ;)

Und hier ist der Konverter für yas;) Viel Spaß beim Programmieren !!

function convertTo12Hrs(yourDateTime){
    var myDate = new Date(yourDateTime);
    var dtObject = new Object();
    var monthsCollection = {0:"January", 1:"February",2:"March",3:"April",4:"May",5:"June",6:"July",7:"August",8:"September",9:"October",10:"November",11:"December"};
    dtObject.year = myDate.getFullYear();
    dtObject.month = monthsCollection[myDate.getMonth()];
    dtObject.day = (myDate.getDate()<10)?"0"+myDate.getDate():myDate.getDate();
    dtObject.minutes = (myDate.getMinutes() < 10)? "0"+myDate.getMinutes():myDate.getMinutes();
    dtObject.seconds = (myDate.getSeconds() < 10)? "0"+myDate.getSeconds():myDate.getSeconds();
    // Check if hours are greater than 12? Its PM
    dtObject.ampmSwitch = (myDate.getHours() > 12)? "PM":"AM";
    // Convert the hours
    dtObject.hour = (myDate.getHours() > 12)?myDate.getHours()-12:myDate.getHours();
    // Add the 0 as prefix if its less than 10
    dtObject.hour = (dtObject.hour < 10)? "0"+dtObject.hour:dtObject.hour;

    // Format back the string as it was or return the dtObject object or however you like. I am returning the object here
    return dtObject;
}

rufen Sie es wie convertTo12Hrs ("04. Februar 2011 19:00:00") auf; Es wird Ihnen das Objekt zurückgeben, das Sie wiederum verwenden können, um Ihre Datetime-Zeichenfolge nach Ihren Wünschen zu formatieren. 

0
A Malik

Sie könnten diese allgemeinere Funktion ausprobieren:

function to12HourFormat(date = (new Date)) {
  return {
    hours: ((date.getHours() + 11) % 12 + 1),
    minutes: date.getMinutes(),
    meridian: (date.getHours() >= 12) ? 'PM' : 'AM',
  };
}

Gibt ein flexibles Objektformat zurück.

https://jsbin.com/vexejanovo/edit

0
AndrewMcLagan

Ich habe bemerkt, dass es bereits eine Antwort gibt, aber ich wollte meine eigene Lösung mit reinem JavaScript mitteilen:

function curTime(pm) {
  var dt = new Date();
  var hr = dt.getHours(), min = dt.getMinutes(), sec = dt.getSeconds();
  var time = (pm ? ((hr+11)%12+1) : (hr<10?'0':'')+hr)+":"+(min<10?'0':'')+min+":"+(sec<10?'0':'')+sec+(pm ? (hr>12 ? " PM" : " AM") : ""); 
  return time;
}

Sie können es in Aktion unter https://jsfiddle.net/j2xk312m/3/ mit dem folgenden Codeblock sehen:

(function() {

  function curTime(pm) {
    var dt = new Date();
    var hr = dt.getHours(), min = dt.getMinutes(), sec = dt.getSeconds();
    var time = (pm ? ((hr+11)%12+1) : (hr<10?'0':'')+hr)+":"+(min<10?'0':'')+min+":"+(sec<10?'0':'')+sec+(pm ? (hr>12 ? " PM" : " AM") : ""); 
    return time;
  }

  alert("12-hour Format:    "+curTime(true)+"\n24-hour Format:    "+curTime(false));

})();
0