将 datetimepicker 值传递给另一个 datetimepicker 并添加 12 小时

Question

我想将值从 datetimepicker1 传递到 datetimepicker2，并在 datetimepicker2 上添加 12 小时。

我的代码正在将值从 datetimepicker 传递到 datetimepicker2。
但是如何在 datetimepicker2 上添加 12 小时？

<div class="row">
  <div class="col-md-12">
    <form id="form1" method="post">
      <div class="form-group">
        <div class='input-group date' id='datetimepicker1'>
          <input type="text" id="r_from"  name="r_from" class="form-control" >
          <span class="input-group-addon">
            <span class="glyphicon glyphicon-calendar"></span>
          </span>
        </div>
      </div>
      <div class="form-group">
        <div class='input-group date' id='datetimepicker2'>
          <input type="text" id="r_until"  name="r_until" class="form-control" ><br>
          <span class="input-group-addon">
            <span class="glyphicon glyphicon-calendar"></span>
          </span>
        </div>
      </div>
      <input type="submit" name="check_cottage" value="Check Availability">
    </form>
  </div>

<script type="text/javascript">
$(function () {
  $('#datetimepicker1').datetimepicker();
  $('#datetimepicker2').datetimepicker({
    useCurrent: false //Important! See issue #1075
  });

  $("#datetimepicker1").on("dp.change", function (e) {
    $('#datetimepicker2').data("DateTimePicker").minDate(e.date);
  });

  $("#datetimepicker2").on("dp.change", function (e) {
    $('#datetimepicker1').data("DateTimePicker").maxDate(e.date);
  });
});
</script>

<script type="text/javascript">
var form = document.getElementById('form1');
form.elements.r_from.onblur = function () {
  var form = this.form;
  form.elements.r_until.value = form.elements.r_from.value;
};
</script>

Answer 1

终于不简单了
我很快修复了控制台中有关 Tether lib 丢失的错误...

然后我玩了很多 Moment 对象格式。
效果很好，因为文档非常好。
关键是找到 BootStrap DateTimePicker 期望的日期格式...

我花了一些时间来质疑我从一开始就认为正确的事情。
喜欢这个选项：

useCurrent:false //Important! See issue #1075

并设置日期...不仅是maxDate，还有第二个DP的日期...
我是靠猜测找到的...因为文档是 &$?%!

$('#datetimepicker2').data("DateTimePicker").date( [the new date + 12h] );

成功了！
查看更新后的 Fiddle

$(function () {
  $('#datetimepicker1').datetimepicker();
  $('#datetimepicker2').datetimepicker({
    useCurrent:"year"
  });

  $("#datetimepicker1").on("dp.hide", function (e) {
    console.log("From DP: "+e.date);

    var momentDate = moment(e.date);
    console.log("DP1 Moment hour: "+momentDate.hour());

    var improvedDate = moment(e.date).add(12,"hour");
    console.log("DP2 Moment date: "+improvedDate.hour());

    var improvedDateForDP = improvedDate.format("MM/DD/YYYY hh:mm:ss A");
    console.log("DP2 Moment hour: "+improvedDateForDP);

    $('#datetimepicker2').data("DateTimePicker").minDate(improvedDate);
    $('#datetimepicker2').data("DateTimePicker").date(improvedDate);
  });

  $("#datetimepicker2").on("dp.change", function (e) {
    $('#datetimepicker1').data("DateTimePicker").maxDate(e.date);
  });

});

我离开了所有 console.logs...

将 datetimepicker 值传递给另一个 datetimepicker 并添加 12 小时

pass datetimepicker value to another datetimepicker and add 12 hours

jquery

datetimepicker

twitter-bootstrap