Question

我有这个Javascript代码用于显示时间（根据时区）和日期，但问题在于AM / PM。随着时间的变化，它不会自动更新;经过多次尝试，我在自动更新方面失败了，因此在这里寻求一些帮助。以下是代码：

$(document).ready(function(){
// Create two variable with the names of the months and days in an array
// Count 3 variable for months
var monthNames = [ "Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec" ]; 
var dayNames= ["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"]

// Create a newDate() object
var newDate = new Date();
// Extract the current date from Date object
newDate.setDate(newDate.getUTCDate());
// Output the day, date, month and year   
$('#Date').html(/*dayNames[newDate.getUTCDay()] + " " + */monthNames[newDate.getMonth()] + ' ' + newDate.getDate() + ', ' + newDate.getFullYear());

setInterval( function() {
  // Create a newDate() object and extract the seconds of the current time on the visitor's
  var seconds = new Date().getUTCSeconds();
  // Add a leading zero to seconds value
  $("#sec").html(( seconds < 10 ? "0" : "" ) + seconds);
  },1000);

setInterval( function() {
  // Create a newDate() object and extract the minutes of the current time on the visitor's
  var minutes = new Date().getUTCMinutes();
  // Add a leading zero to the minutes value
  $("#min").html(( minutes < 10 ? "0" : "" ) + minutes);
  },1000);

setInterval( function() {
  // Create a newDate() object and extract the hours of the current time on the visitor's
  var hours = new Date().getUTCHours();
    var ampm    = 'AM';
if(hours > 5)
{
    hours -= 5; // Time Zone
    ampm = 'AM'; // AM/PM According to Time Chosen
}
    else if(hours == 5)
{
    ampm = 'PM';    
};

  // Add a leading zero to the hours value
  $("#hours").html(( hours < 10 ? "0" : "" ) + hours);

  $("#ampm").html(ampm);
  }, 1000); 
});

<span id="hours"></span>:<span id="min"></span>&nbsp;<span id="ampm"></span>&nbsp;&nbsp;<span id="Date"></span>

Answer 1

也许某些图书馆会让你的生活更轻松

https://momentjs.com/timezone/

我不想自己写这个，但这绝对是好习惯这正是你想要的，并且不断调用setInterval中的时间来更新时间。

Answer 2

我不确定你要做什么，但是如果你试图使用主机系统设置UTC-0500的时区然后以特定格式显示日期和时间，那么有很多问题这里已经有了。

一种简单的方法是获取主机日期，根据主机时区偏移量移动时间并补偿默认的5小时。然后适当地格式化时间。时间以分钟为单位进行调整，因为 getTimezoneOffset 会返回，并且适合偏移量不均匀的情况。

调整完日期后，设置上午/下午非常简单：

var ampm = d.getHours() < 12? 'am' : 'pm';

根据需要经常调用该功能以显示当前时间。

// Return a date adjusted to UTC-0500
function getOffsetDate() {
  var d = new Date();
  // Set to UTC-0500: add timzone offset then subtract 300 mins
  d.setMinutes(d.getMinutes() + d.getTimezoneOffset() - 300);
  return d;
}

// Format time as hh:mm:ss ap 
function formatTime(d) {
  function z(n){return (n<10? '0' : '') + n}
  var ap = d.getHours() < 12? 'am' : 'pm';
  return z(d.getHours()) + ':' + z(d.getMinutes()) + ':' +
         z(d.getSeconds()) + ' ' + ap;
}

function showTime() {
  // Delay to just after next full second
  var delay = 1020 - new Date().getMilliseconds();
  // Show time
  document.getElementById('time').textContent = formatTime(getOffsetDate());
  // Call again
  setTimeout(showTime, delay);
}

showTime();

<div>The time in timezone UTC-0500 is <span id="time"></span></div>

如何在Javascript中使AM / PM随时间正常工作

2 个答案: