JQuery datepicker- 2 个输入“From”和“To”

Question

我正在使用 Jquery datepicker 插件 timepicker addon在两个输入框中，一个用于“开始”日期，第二个用于“结束”日期。

当我设置第一个时，我希望第二个日期是第一个中选择的日期之后的一天，禁用早于“从”日期中选择的日期的所有日期

如果首先选择“结束”日期，则“开始”日期将设置为“结束”日期的前一天。

我找到了一些例子，但我不知道如何获取日期和时间。所以，如果我，例如，选择13/12/“开始”日期中的日期为 2010 15:50，“结束”日期中的日期设置为 14/12/2010 15:50 或至少到14/12/2010 00:00。

已编辑***

我刚刚找到了这个piece of code这按我想要的方式工作，但没有时间选择器插件。

 $(function(){

  $('#dateFrom').datepicker({
    dateFormat: 'dd/mm/yy',
    onSelect: function(dateText, inst) {
         $('#dateTo').datepicker('option','minDate', new Date(inst.selectedYear, inst.selectedMonth, inst.selectedDay));
          }
  });
  $('#dateTo').datepicker({
    dateFormat: 'dd/mm/yy',
    onSelect: function(dateText, inst) {
         $('#dateFrom').datepicker('option','maxDate', new Date(inst.selectedYear, inst.selectedMonth, inst.selectedDay));
    }          
  });

});

基于上面的代码，是否可以对其进行修改，以便我可以将其与时间选择器插件一起使用？

先谢谢了

Answer 1

我已经掌握了大部分内容，但无法弄清楚如何在小部件初始化后设置 hourMin 和 monthMin 。给定以下 HTML:

<label for="from">From</label><input id="from" name="from" />
<label for="to">To</label><input id="to" name="to" />

还有这个 JS:

$("#from").datetimepicker();
$("#to").datetimepicker({
    beforeShow: function(input, inst) {
        var $toDateInput = $("#to");
        var fromDate = $("#from").datetimepicker("getDate");
        var toDate = $toDateInput.datetimepicker("getDate");
        var afterFromDate;

        if (fromDate) {
            if (!toDate || (toDate <= fromDate)) {
                afterFromDate = new Date(fromDate.toUTCString());
                afterFromDate.setDate(afterFromDate.getDate() + 1);               
                $toDateInput.datetimepicker("setDate", afterFromDate);
            }
            $toDateInput.datetimepicker("option", "minDate", fromDate);
        }
    }
});

在这里查看:http://jsfiddle.net/RWjtL/3/

满足您的大部分标准，但有一些问题不符合:

• 当您将“至”字段设置为空时，“从”日期选择器的最短日期不会被删除。我尝试将 minDate 选项设置为 null 和 "" 并得到了奇怪的行为。 Here's a documented issue that could be related .
• beforeShow 方法被调用多次。我认为这是因为在处理程序内调用了 setDate，但无法确定。
• 如上所述，我无法在事后设置 hourMin 和 minuteMin，并且设置 minDate 似乎也不起作用尊重日期的时间部分。

作者的GitHub page有一个问题列表，其中一些似乎与我遇到的问题有关。希望这至少能让您开始。