Question

我正在尝试显示一个聊天div，该聊天div在星期一至星期五的上午8点至下午6点之间显示为“在线”，或者根据东部时区（NYC），如果离线则不显示任何内容，以便北京的客户能够看到根据这些时间在线或离线。

仅需要show（）或hide（）div。到目前为止，我有时间，但是我不确定如何使它们与用户时区相关。

$(document).ready(function () {

var start = new Date();
var end = new Date();
var time = new Date().getTime();

if (time > start.setHours(8,00) && time < end.setHours(18,00)) {
    $('.online').show();
}
else {
    $('.offline').hide();
    }
});

Answer 1

先前的答案（seen in edit history）是使用UTC的偏移量，但是，如果要支持夏令时，这将不是一个选择。这是很重要的事情。

因此，对先前建议的修改完全删除了UTC的使用。为了支持夏时制，从EST获取时间的唯一正确方法是将语言环境设置为该位置，读取时间，设置新的日期对象（从技术上讲，它将在客户端本地中设置，但是我们真正想要的只是Date对象的日期和小时响应，因此我们将忽略这种技术性。）

这是通过传递带有toLocaleString调用的对象来指定的，该对象指定时区，然后使用该结果构造一个新日期。

var NYDate = new Date(new Date().toLocaleString("en-US", {timeZone: "America/New_York"}));

var NYHour = NYDate.getHours();
var NYDay = NYDate.getDay()

if (NYHour >= 8 && NYHour <= 18 &&
    NYDay > 0 && NYDay < 6) {
    $('.online').show();
}else {
    $('.online').hide();
}

.online { 
  display: none;
  color: green;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="online">Online</div>

Answer 2

不需要JavaScript。您应该从服务器端执行此操作。（顾客不会告诉商店营业时间，商店会告诉顾客！）

假设您的HTML是由某些服务器端语言（PHP，Ruby等）生成的，则将程序设置为使用纽约时间，并简单地计算您是否处于“开放时间”之内。如果您是开放的，则生成“聊天” div。如果您关门了...不要。

（或者，通过CSS和类显示/隐藏它）

Answer 3

事实证明，使用JavaScript并不是一项完全琐碎的任务（如@StephenR的回答中所述，这可能在服务器端更容易处理）。而且，正如一些评论所指出的那样，使用库可能是更好的js方法。

也就是说，在仔细考虑了@RobG的有关浏览器对timeZone中的toLocaleString之类的选项的不同支持的评论之后，我很好奇如何解决另一种问题（让我感谢各种js日期库）。下面的代码段...

let d = new Date(); // current datetime
let month = d.getUTCMonth(); // utc month (jan is 0)
let date = d.getUTCDate(); // utc date
let hour = d.getUTCHours(); // utc hours (midnight is 0)
let day = d.getUTCDay(); // utc weekday (sunday is 0)
let offset = 4; // assume EDT to start
let adjust = 1; // offset adjustment at DST
let mar = (month === 2); // march boolean
let nov = (month === 10); // november boolean

// handle march and november (DST change months)
if (mar || nov) {
  if (mar) {
    offset = 5; // assume EST to start
    adjust = -1; // DST adjustment to EDT
  }
  // handle offset shift to prior day
  if (hour - offset < 0) {
    date -= 1;
    day -= 1;
  }
  // handle date ranges when DST change may or may not have occurred yet 
  if ((mar && date > 7 && date < 15) || (nov && date < 8)) {
    // DST adjustment on or after DST sunday at 2:00am
    if (date >= date - day && hour - offset >= 2) {
      offset += adjust;
    }
  // DST adjustment for dates after DST change has already occured  
  } else if ((mar && date > 14) || (nov && date > 7)) {
    offset += adjust;
    // handle EDT to EST offset shift to prior day (not already handled above)
    if (nov && hour === 4) {
      date -= 1;
      day -= 1;
    }
  }
// handle months without DST changes
} else {
  // EDT to EST adjustment for EST months
  if (month < 2 || month > 10) {
    offset += adjust;
  }
  // handle offset shift to prior day
  if (hour < offset) {
    day -= 1;
  }
}

// get current timezone hour
if (hour >= offset) {
  hour -= offset;
} else {
  hour = hour - offset + 24;
}

// do something on weekdays between 8am and 6pm
if (day > 0 && day < 6 && hour > 7 && hour < 19) {
  console.log('online'); // handle online
// do something else on nights and weekends
} else {
  console.log('offline'); // handle offline
}

根据远程时区和日期显示div

3 个答案: