我想为特定时区创建一个 javascript 时钟

Question

我想向我的网站添加一个时钟，显示中部时区的时间。我已经包含了迄今为止的代码。我想用它来告诉用户我网站上的其他工具何时将处于活动状态（它们在中部时区的夜间不活动）。有谁知道如何（1）将其锁定到中央时间； (2) 也许从晚上 8:00 到早上 7:30 将其变成红色（表示工具已关闭）？

<script type="text/javascript">

function GetClock(){
d = new Date();
nhour  = d.getHours();
nmin   = d.getMinutes();
     if(nhour ==  0) {ap = " AM";nhour = 12;} 
else if(nhour <= 11) {ap = " AM";} 
else if(nhour == 12) {ap = " PM";} 
else if(nhour >= 13) {ap = " PM";nhour -= 12;}

if(nmin <= 9) {nmin = "0" +nmin;}

document.getElementById('clockbox').innerHTML=""+nhour+":"+nmin+ap+"";
setTimeout("GetClock()", 1000);
}
window.onload=GetClock;
</script>
<div id="clockbox"></div>

Answer 1

Date 对象可以修改为您喜欢的任何值，并且会自动更正。
“风时钟（2）；”将时区偏移设置为 +2 UTC。

<script type="text/javascript">

function addLeadingZero(n) {
    if (n < 10) {
        n = "0" + n;
    }
    return n;
}

function windTheClock(timeZoneOffset)
{
    var d = new Date();
    d.setHours(d.getUTCHours() + timeZoneOffset); // set time zone offset
    var h = d.getHours();
    var m = d.getMinutes();
    var s = d.getSeconds();
    h = addLeadingZero(h);
    m = addLeadingZero(m);
    s = addLeadingZero(s);
    document.all["clock"].innerHTML = h + ":" + m + ":" + s;
    setTimeout(function(){ windTheClock(timeZoneOffset) }, 1000);
}

window.onload = function() {
    windTheClock(2);
}

</script>

<div id="clock"></div>

---

带 am/pm 的版本

function addLeadingZero(n) {
    return n < 10 ? '0' + n : n;
}

function windTheClock(timeZoneOffset)
{
    var d = new Date();
    d.setHours(d.getUTCHours() + timeZoneOffset); // set time zone offset
    var h = d.getHours();
    var m = d.getMinutes();
    var s = d.getSeconds();
    var ampm = h >= 12 ? 'pm' : 'am';
    h = h % 12;
    h = h ? h : 12; // replace '0' w/ '12'
    h = addLeadingZero(h);
    m = addLeadingZero(m);
    s = addLeadingZero(s);

    document.all["clock"].innerHTML = h + ':' + m + ':' + s
        + ' ' + ampm;
    setTimeout(function(){ windTheClock(timeZoneOffset) }, 1000);
}

window.onload = function() {
    windTheClock(2);
}

https://jsfiddle.net/dzyubak/rae8j6xn/

Answer 2

如果您创建本地日期对象，它将位于本地系统的时区中（无论设置为何，可能不是实际的本地时区）。日期对象有一个 getTimezoneOffset 方法，该方法返回一个以分钟为单位的数字，如果将其添加到本地日期对象，则会将其设置为 UTC（本质上是 GMT）。然后，您可以减去“中央时间”（无论是什么）的偏移量以获得该时区的时间。

然后，您可以使用该日期对象来表示该区域中的时间。

如果时区是美国中部时区，则标准偏移量为-6小时，夏令时偏移量为-5小时。返回具有特定偏移量的日期对象的函数是：

/* Create a date object with the desired offset.
   Offset is the time that must be added to local time to get
   UTC, so if time zone is -6hrs, offset is +360. If time zone
   is +10hrs, offset is -600.
*/
function getOffsetDate(offsetInMintues) {
  // Get local date object
  var d = new Date();
  // Add local time zone offset to get UTC and 
  // Subtract offset to get desired zone
  d.setMinutes(d.getMinutes() + d.getTimezoneOffset() - offsetInMintues);
  return d;
}

给它适当的偏移量，它将返回具有该偏移量的日期对象。要获取美国标准中部时间：

var centralDate = getOffsetDate(360);

对于美国中部夏令时：

var centralDSTDate = getOffsetDate(300);

要在特定时间之间执行某些操作，您可以执行以下操作：

var h = centralDate.getHours();
var m = centralDate.getMinutes(); 
if (h >= 20 || 
  h <7 ||
  (h == 7 && m <= 30) {
  // the time is between 20:00 and 07:30 the following day.
}