javascript jquery datepicker getTime 不是 UTC

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/14962222/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-26 23:01:57  来源:igfitidea点击:

jquery datepicker getTime not UTC

javascriptjqueryjquery-uijquery-ui-datepickerutc

提问by Tom

I have the following code which works fine until the datepicker reaches BST.

我有以下代码可以正常工作,直到日期选择器到达 BST。

var i;
function showEventDates(date) {
  for (i = 0; i < startDates.length; i++) {
    if (date.getTime() == startDates[i]) {
      return [true, 'eventDay'];
    }
  }    
  return [false, ''];
}
var startDates = new Array();

$("select.startdates").find("option").each( function() {
  startDates.push(Date.UTC.apply(Date, this.value.split(",").map(Number)));
});

$('#mydate').datepicker({
    beforeShowDay: showEventDates
});

During BST the line if (date.getTime() == startDates[i]) {returns false because there's an hour difference.

在 BST 期间,该行if (date.getTime() == startDates[i]) {返回 false,因为有一个小时的差异。

Any ideas how I can get these to match? I think it's the datepicker time that's not UTC.

任何想法如何让这些匹配?我认为这是不是 UTC 的日期选择器时间。

EDIT:

编辑:

An example of an option from select.startdates is

select.startdates 中的一个选项示例是

<option value="2013, 2, 1">01/03/2013</option>

回答by Martijn

It looks like the datepicker doesn't return UTC dates, but local ones (which is actually the default in Javascript).

看起来日期选择器不返回 UTC 日期,而是返回本地日期(这实际上是 Javascript 中的默认值)。

To convert your constructed dates to local time:

要将构建的日期转换为本地时间:

$("select.startdates").find("option").each( function() {
  var d = Date.UTC.apply(Date, this.value.split(",").map(Number));
  d = d + new Date(d).getTimezoneOffset() * 60000; // convert UTC to local
  startDates.push(d);
});

Normally, I'd use the new Date(year, month, day)constructor instead of the Date.UTCfunction, but you can't use applywith the Dateconstructor.

通常,我会使用new Date(year, month, day)构造函数而不是Date.UTC函数,但您不能applyDate构造函数一起使用。

If you'd rather leave your startDates array in UTC, then you need to convert the datepicker's dates to UTC:

如果您希望将 startDates 数组保留为 UTC,则需要将日期选择器的日期转换为 UTC:

function showEventDates(date) {
  date = date - new Date(date).getTimezoneOffset() * 60000; // convert local to UTC
  // for ...
}

NB: choose one orthe other of these methods, not both, or you'll end up with the same problem... :-)

注意:选择这些方法中的一种另一种,而不是两者,否则你最终会遇到同样的问题...... :-)

回答by petrocket

I hear there are some timezone updates to the jQuery datetimepicker so you may want to check the site first, however here is what I did to get the selected date & time in UTC format.

我听说 jQuery datetimepicker 有一些时区更新,因此您可能想先检查该站点,但是这是我为以 UTC 格式获取所选日期和时间所做的工作。

First create the datetimepicker and use cities instead of +0500 GMT because if you use GMT offsets you have to take into account daylight savings - and that is a nightmare.

首先创建日期时间选择器并使用城市而不是 +0500 GMT,因为如果您使用 GMT 偏移量,您必须考虑夏令时 - 这是一场噩梦。

 // create ye datetimepicker with timezone options 
 $('#datetimepicker').datetimepicker({
    showTimezone: true,
    onSelect: onSelect,
    timezoneList: [
      { value: 'America/New_York', label: 'New York'},
      { value: 'America/Chicago', label: 'Chicago' } ,
      { value: 'America/Denver', label: 'Denver' },
      { value: 'America/Los_Angeles', label: 'Los Angeles' }
    ]);

Next, grab the timezoneJS.Date library from mde on Github(NOTE: you will also need to download the appropriate timezone files for your region, just follow the README instructions)

接下来,从Github 上的 mde获取 timezoneJS.Date 库(注意:您还需要下载适合您所在地区的时区文件,只需按照 README 说明进行操作)

Now when the user selects a date the onSelect method gets called.

现在,当用户选择一个日期时,onSelect 方法被调用。

function onSelect(dateText, dateInst) {
  // get the date without the timezone data
  var d = $('#datetimepicker').datepicker('getDate');

  // init timezoneJS
  timezoneJs.timezone.zoneFileBasePath = '/tz';
  timezoneJs.timezone.init();

  // get the selected timezone
  var tz = $('#datetimepicker').data('datepicker').settings.timepicker.timezone

  // construct the utcDate with the help of the timezoneJS.Date lib
  var utcDate = new timezoneJS.Date(
    d.getFullYear(),
    d.getMonth(),
    d.getDate(),
    d.getHours(),
    d.getMinutes(),
    tz)
  var utcLinuxTimestamp = utcDate.getTime() / 1000    
}

Not exactly painless, but it takes care of the daylight savings stuff for you.

并非完全无痛,但它会为您处理夏令时的事情。

The reverse of this to populate a datetimepicker with a date and a timezone from a UTC timestamp looks like this:

使用UTC时间戳中的日期和时区填充日期时间选择器的相反操作如下所示:

// init timezone JS
timezoneJs.timezone.zoneFileBasePath = '/tz';
timezoneJs.timezone.init();

// get timezone date JS object
var tz = 'America/New York';
var d = new timezoneJS.Date( timestamp * 1000, tz);

$('#datetimepicker').datetimepicker({
  showTimezone: true,
  timezoneList: [ 
      { value: 'America/New_York', label: 'New York'},
      { value: 'America/Chicago', label: 'Chicago' } ,
      { value: 'America/Denver', label: 'Denver' },
      { value: 'America/Los_Angeles', label: 'Los Angeles' }
    ],
  timezone: tz,
  defaultDate: d._dateProxy,
  onSelect: onSelect
}).datepicker('setDate',d._dateProxy);

I'm not certain if you need the setDate part on the last line, but couldn't hurt.

我不确定您是否需要最后一行的 setDate 部分,但不会受到伤害。

回答by ymz

based on @Martijn comment:

基于@Martijn 评论:

var offset = date.getTimezoneOffset();

if (date.getTime() - offset == startDates[i]) 
{
      return [true, 'eventDay'];
}