考虑时区的客户端日期比较 - Javascript/Jquery

问题描述

我有一个要求,我需要将日期与当地时间进行比较。我正在 EST DateTime 中的 DatetimePicker 中设置一个日期。所以我需要将它与当前时间进行比较,如果它小于当前时间,我需要显示验证警报。用户机器中的当前时间将具有不同的时区。所以我总是需要在比较之前将当前时区转换为 EST 时区。如果当前时区在 EST 中的用户机器中,则需要考虑相同的值并且不需要转换。如何在 Javascript/Jquery 中实现这一点。如何修改下面的 javascript 以处理上述情况。

iam 设置 START_DATE n cshtml 页面如下

  <div class='input-group date' id='datetimepicker1'>
                                @Html.EditorFor(model => model.START_DATE,new { htmlAttributes = new { @class = "form-control z-index-0" } })
                                <span class="input-group-addon" id="calenderStart">
                                    <span class="glyphicon glyphicon-calendar"></span>
                                </span>
                            </div>

在 Javascript 方面...

var startDate= new Date($("#START_DATE").val());
var currentDateTime= new Date();  //Convert to EST if it is in DifferentTimeZone.Doubt on this part
if(startDate < currentDateTime)
{
 alert ("StartDateTime should be greater than current EST DateTime);
}

解决方法

也许最容易理解的方法是将两个日期时间都转换为 UTC,然后进行比较。

要将日期选择器时间转换为 UTC,您只需添加 5 小时,因为 EST 总是比 UTC 晚 5 小时。

var theDateAsString = "07/15/2021 12:08 PM";
var dateFromDatePicker = new Date(theDateAsString);
dateFromDatePicker.setHours(dateFromDatePicker.getHours() + 5);
console.log(dateFromDatePicker);

独立于您的位置,控制台将为您提供 EST 时间加 5 小时。控制台将打印带有时区偏移量的 UTC 日期,例如,如果您在中欧夏令时区(比 UTC 晚 2 小时),它会打印以下内容:

Date Thu Jul 15 2021 17:08:00 GMT+0200 (Central European Summer Time)

所以现在您还需要将用户的时间转换为 UTC 以便能够进行比较。您可以使用 getTimezoneOffset() 轻松完成此操作。这将以分钟为单位返回用户的时区偏移量,因此我们可以将这些分钟添加到用户的日期中。

var usersDate = new Date();
console.log(usersDate); //e.g. Date Fri Jul 09 2021 12:44:39 GMT+0200 (Central European Summer Time)
console.log(usersDate.getTimezoneOffset());// e.g. -120 === -2 hours
usersDate.setMinutes(usersDate.getMinutes() + usersDate.getTimezoneOffset());
console.log(usersDate); // e.g. Date Fri Jul 09 2021 10:44:39 GMT+0200 (Central European Summer Time)

现在您可以只比较日期:

if(usersDate < dateFromDatePicker){
    alert("earlier");
}
else{
    alert("later or the same");
}

为了证明此方法有效,假设用户处于中欧夏令时(UTC + 2 小时),日期时间为 7 月 9 日的 13:00。这将打印“用户的日期更早”,因为时区之间的差异是 7 小时(07:00 + 7 = 14:00):

var theDateAsString = "07/09/2021 07:00 AM";
var dateFromDatePicker = new Date(theDateAsString);
dateFromDatePicker.setHours(dateFromDatePicker.getHours() + 5);
console.log(dateFromDatePicker);
var usersDate = new Date();
usersDate.setMinutes(usersDate.getMinutes() + usersDate.getTimezoneOffset());
console.log(usersDate);
if(usersDate < dateFromDatePicker){
    console.log("user's date is earlier");
}
else{
    console.log("user's date is later or the same");
}

这将打印“用户的日期晚于或相同”(05:00 + 7 小时 = 12:00):

var theDateAsString = "07/09/2021 05:00 AM";
var dateFromDatePicker = new Date(theDateAsString);
dateFromDatePicker.setHours(dateFromDatePicker.getHours() + 5);
console.log(dateFromDatePicker);
var usersDate = new Date();
usersDate.setMinutes(usersDate.getMinutes() + usersDate.getTimezoneOffset());
console.log(usersDate);
if(usersDate < dateFromDatePicker){
    console.log("user's date is earlier");
}
else{
    console.log("user's date is later or the same");
}
,

在 JavaScript 中,您可以使用 toLocaleString 并提供时区代码进行转换。

var d = new Date();
d.toLocaleString('en-GB',{ timeZone: 'UTC' })
console.log(d);

More example can be found on this URL.
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/toLocaleString