So legen Sie die Netzwerkzeit in JQuery fest

In der Front-End-Entwicklung müssen wir häufig die aktuelle Zeit ermitteln, um verschiedene Vorgänge auszuführen. Ein Nachteil der Ermittlung der Ortszeit besteht jedoch darin, dass sie von der Computersystemzeit des Benutzers beeinflusst wird. Wenn die Computerzeit des Benutzers falsch ist, ist auch die erhaltene Zeit falsch. Daher ist es manchmal erforderlich, Netzwerkzeit zu ermitteln, um die Genauigkeit sicherzustellen.

Wie bekommt man also die Netzwerkzeit? Ein gängiger Ansatz besteht darin, die aktuelle Uhrzeit über die Anforderungszeitschnittstelle abzurufen. Hier können wir jQuery verwenden, um die Netzwerkzeit zu ermitteln.

jQuery manuelle Zeiteinstellungsmethode

In jQuery können wir den folgenden Code verwenden, um die Netzwerkzeit abzurufen:

$.ajax({

url: 'http://quan.suning.com/getSysTime.do',
type: 'post',
dataType: 'jsonp',
jsonp: 'callback',
jsonpCallback: 'jsonpCallback',
success: function(data){
    console.log(data);//data为当前时间格式为YYYY-MM-DD HH:MM:SS，例如 2022-01-01 12:00:00
}

});

Hier erhalten wir die aktuelle Zeit über die von bereitgestellte Schnittstelle Suning.com-Zeit. Darunter ist der URL-Parameter die Schnittstellenadresse; der dataType-Parameter ist der Antwortdatentyp. Hier verwenden wir das JSONP-Format, um die Daten zu erhalten, und der jsonpCallback-Parameter ist der Name von die Callback-Funktion.

Wenn die Anfrage erfolgreich ist, können wir die aktuellen Zeitdaten in der Erfolgsrückruffunktion abrufen. Hier drucken wir die Zeit auf der Konsole aus.

Und was ist, wenn Sie die Uhrzeit manuell einstellen möchten? Wir können den folgenden Code verwenden:

const date = new Date('2022/01/01 12:00:00');
console.log(date);

Hier übergeben wir zunächst eine Datumszeichenfolge Datumsobjekt im Format JJJJ/MM/TT HH:MM:SS, die hier eingestellte Zeit ist 2022/01/01 12:00:00. Dann drucken Sie das Objekt einfach auf der Konsole aus. Wenn wir den Zeitstempel dieser Zeit benötigen, können wir den folgenden Code verwenden:

const timeStamp = date.getTime();
console.log(timeStamp);

Hier können wir die aktuelle Zeit über getTime abrufen Methode des Zeitstempels des Date-Objekts (Anzahl der Millisekunden vom 1. Januar 1970 00:00:00 UTC bis zur aktuellen Zeit) und gibt den Wert dann auf der Konsole aus.

jQuery automatische Zeitsynchronisierungsmethode

Obwohl es bequem ist, die Zeit manuell einzustellen, bevorzugen wir in tatsächlichen Anwendungen, dass die Zeit automatisch synchronisiert und kontinuierlich aktualisiert werden kann. Hier können wir die setInterval-Methode verwenden, um die Zeit regelmäßig zu aktualisieren.

Zum Beispiel können wir den folgenden Code verwenden:

function syncTime(){

$.ajax({
    url: 'http://quan.suning.com/getSysTime.do',
    type: 'post',
    dataType: 'jsonp',
    jsonp: 'callback',
    jsonpCallback: 'jsonpCallback',
    success: function(data){
        const date = new Date(data.replace(/-/g, '/'));
        $('#current-time').html(date.toLocaleString());
    }
});

}
//Aktualisierungszeit jede Sekunde
setInterval(syncTime, 1000);

Hier definieren wir eine syncTime-Methode für Get und Aktualisieren Sie die Uhrzeit. In der Erfolgsrückruffunktion formatieren wir die zurückgegebene Zeitzeichenfolge, erstellen ein Date-Objekt über die neue Date-Methode und verwenden die toLocaleString-Methode, um die Zeit in das lokale Format zu konvertieren und die Zeit im Dom mit der ID von current-time anzuzeigen Element.

Am Ende verwenden wir die setInterval-Methode, um regelmäßig die syncTime-Methode aufzurufen, um den Effekt der automatischen Zeitsynchronisierung zu erzielen.

Zusammenfassung

Oben haben wir vorgestellt, wie man mit jQuery Netzwerkzeit erhält, wie man die Zeit manuell einstellt und die Zeit automatisch synchronisiert. In praktischen Anwendungen müssen wir je nach Situation die geeignete Methode auswählen, um die Genauigkeit der Zeit sicherzustellen.

Das obige ist der detaillierte Inhalt vonSo legen Sie die Netzwerkzeit in JQuery fest. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!