如何在jQuery日期和时间选择器中使用javascript/jQuery调整时区

Question

查询：

如何使用jQuery、Javascript或两者中的任何一个插件将用户在本地时区中指定的日期和时间调整为UTC或其他给定时区？

背景：

我在html表单文本字段上使用bootstrap datetimepicker插件。用户可以指定未来的日期和时间(以安排活动，即电话(。他们将在自己的时区中指定日期和时间，而不会被要求指定时区(这意味着他们将看到的只是一个日历和时钟，他们将在上面选择所需的日期和时间(。我需要能够将此时间(和日期，如果适用(调整为UTC或其他时区(特别是EST/EDT，具体取决于夏令时是否适用(。用户不得意识到正在进行此调整。因此，必须以某种方式检测它们的时区。由于我使用的是bootstrap datetimepicker，所以moment.js插件是可用的。我可能会包含任何我认为合适的javascript/jQuery插件或库(页面加载时间不是我必须考虑的因素(。当然，我可以在页面中添加一个隐藏字段，以便提交调整后的时间。

要求/限制：

• 我必须使用引导程序日期时间选择器进行输入
• 我无法询问用户的本地时区
• 我无法向用户询问他们的位置
• 我无法向用户显示调整后的时区
• 我无法编辑接收表单数据并将其存储在mySQL数据库中的PHP
• 我必须使用javascript或jQuery来实现这一点(除非有一些我不知道的HTML/CSS魔法，否则这应该是既定的(

代码：

我不确定它是否有用，但这是我的代码：

 $(function() {
   if (parseInt($(window).width()) < 768) {
     $('#datetimepicker1').datetimepicker({
       inline: true,
       useCurrent: false,
       daysOfWeekDisabled: [0, 6],
       defaultDate: false,
       showClear: true,
       showTodayButton: true
     });
   } else {
     $('#datetimepicker1').datetimepicker({
       inline: true,
       sideBySide: true,
       useCurrent: false,
       daysOfWeekDisabled: [0, 6],
       defaultDate: false
     });
   }
 });

<!-- BEGIN NEEDLESSLY LARGE NUMBER OF EXTERNAL LIBRARIES -->
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet" type="text/css">
<link href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet">
<link href="//cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.14.30/css/bootstrap-datetimepicker.min.css" rel="stylesheet">
<script src="//code.jquery.com/jquery-2.1.4.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.5/js/bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.10.3/moment.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.14.30/js/bootstrap-datetimepicker.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.10.3/locales.min.js"></script>
<!-- END NEEDLESSLY LARGE NUMBER OF EXTERNAL LIBRARIES -->
<!-- BEGIN LIKELY IRRELEVANT CODE -->
<form action="some.php" method="post" enctype="multipart/form-data" class="grid-form">
  <label>Optimal Date and Time (optional)</label>
  <input class="hidden" type="text" name="time" id="datetimepicker1">
  <div class="datetimeplaceholder"></div>
  <br>
  <br>
  <button type="submit" class="btn btn-primary">Send Message</button>
</form>
<!-- END LIKELY IRRELEVANT CODE -->

如果SO的代码段很难处理，也可以在Codepen上找到：Codepen.io/anon/pen/gpBgBz

注意事项：

我为你的冗长道歉。我在SO上看到过类似的条目。这几乎可以肯定是重复的；然而，我并没有真正理解所提供的答案。我不太擅长jQuery，或者一般的JS。尽管如此，我确实认识到，解决这个问题的方法很糟糕。任意的要求使这一点过于复杂。

Answer 1

选择器导出一个moment.js时刻。我从那一刻起就想好了如何找到UTC时间和日期。

$("form").submit(function() {
    var datetime1 = $('#datetimepicker1').data("DateTimePicker").date();
    var correctdatetime = datetime1.utc();
    $('#datetimepicker1').val(correctdatetime);
}

这实现了我想要的。