Javascript显示日期和时间在我的网站使用UTC考虑用户的时区在Javascript

Javascript display date and time in my website using UTC to consider users timezone in javascript

本文关键字:Javascript UTC 时区 用户 网站 日期 显示 时间 我的      更新时间:2023-09-26

我想在我的网站上有一个定时器,就像一个数字时钟。它会有一个日期和时间。我用下面的代码来做:

var clockID = 0;
function UpdateClock() {
   if(clockID) {
      clearTimeout(clockID);
      clockID  = 0;
   }
    var tDate = new Date();
    var in_hours = tDate.getHours()
    var in_minutes=tDate.getMinutes();
    var in_seconds= tDate.getSeconds();
    if(in_minutes < 10)
        in_minutes = '0'+in_minutes;
    if(in_seconds<10)   
        in_seconds = '0'+in_seconds;
    if(in_hours<10) 
        in_hours = '0'+in_hours;
   document.getElementById('theTime').innerHTML = "" 
                   + in_hours + ":" 
                   + in_minutes + ":" 
                   + in_seconds;
   clockID = setTimeout("UpdateClock()", 1000);
}
function StartClock() {
   clockID = setTimeout("UpdateClock()", 500);
}
function KillClock() {
   if(clockID) {
      clearTimeout(clockID);
      clockID  = 0;
   }
}

但是这段代码显示的是当前的计算机时间,所以时间不适合我的时区。我还需要在我的代码中添加什么,以便它根据我的时区显示日期和时间?如果日期是夏令时,它也会显示夏令时的确切时间。

如果您只需要使用JS,请查看

添加或减去javascript日期的时区差异

例如DEMO

var clockID;
var yourTimeZoneFrom = -7.00; //time zone value where you are at
var d = new Date();  
//get the timezone offset from local time in minutes
var tzDifference = yourTimeZoneFrom * 60 + d.getTimezoneOffset();
//convert the offset to milliseconds
var offset = tzDifference * 60 * 1000;
function UpdateClock() {
    var tDate = new Date(new Date().getTime()+offset);
    var in_hours = tDate.getHours()
    var in_minutes=tDate.getMinutes();
    var in_seconds= tDate.getSeconds();
    if(in_minutes < 10)
        in_minutes = '0'+in_minutes;
    if(in_seconds<10)   
        in_seconds = '0'+in_seconds;
    if(in_hours<10) 
        in_hours = '0'+in_hours;
   document.getElementById('theTime').innerHTML = "" 
                   + in_hours + ":" 
                   + in_minutes + ":" 
                   + in_seconds;
}
function StartClock() {
   clockID = setInterval(UpdateClock, 500);
}
function KillClock() {
  clearTimeout(clockID);
}
window.onload=function() {
  StartClock();
}

在JS中你可以得到当前的时区偏移量。您需要将偏移量调整到所需的时区。

<div id="theTime"></div>
<script>
  var clockID = 0;
  var requiredTimeZone = 360; // CST (+6:00 hrs)
  function UpdateClock() {
     if(clockID) {
        clearTimeout(clockID);
        clockID  = 0;
     }
      var tDate = new Date();
      var calculatedTime = tDate.getTime() + (tDate.getTimezoneOffset() * 60000) - (requiredTimeZone * 60000);
      tDate.setTime(calculatedTime);
      var in_hours = tDate.getHours()
      var in_minutes=tDate.getMinutes();
      var in_seconds= tDate.getSeconds();
      if(in_minutes < 10)
          in_minutes = '0'+in_minutes;
      if(in_seconds<10)   
          in_seconds = '0'+in_seconds;
      if(in_hours<10) 
          in_hours = '0'+in_hours;
     document.getElementById('theTime').innerHTML = "" 
                     + in_hours + ":" 
                     + in_minutes + ":" 
                     + in_seconds;
     clockID = setTimeout("UpdateClock()", 1000);
  }
  function StartClock() {
     clockID = setTimeout("UpdateClock()", 500);
  }
  function KillClock() {
     if(clockID) {
        clearTimeout(clockID);
        clockID  = 0;
     }
  }
  StartClock();
</script>

将当前浏览器的时区偏移量添加到浏览器时间中,然后减去所需的时区偏移量以获得所需的时间。

您所需的时区需要以某种方式传达给浏览器,以使其工作