1

我有 2 个 jquery datepickers 来选择一个日期范围。

一旦我选择了一个起始日期（从第一个日期选择器开始），我想激活第二个（到）日期选择器。

下面的代码就是这样做的，但由于某种原因，它会立即关闭日期选择器。

有任何想法吗？- http://jsfiddle.net/rN4zu/

From <input type="text" id="dateFrom" />
To <input type="text" id="dateTo" />

jQuery

$( "#dateFrom" ).datepicker({
    minDate: 0,
    maxDate: "+2Y",
    showWeek: true,
    weekHeader: 'Wk',
    onSelect: function( selectedDate ) {
        $( "#dateTo" ).datepicker("option", "minDate", selectedDate ).focus();
    }
});

$( "#dateTo" ).datepicker({
    maxDate: "+2Y",
    showWeek: true,
    weekHeader: 'Wk'
});
4

3 回答 3

9

http://jsfiddle.net/8YTKR/

问题与命令相互冲突有关。set min date 命令和.focus同时发生，这导致了问题。

好的，所以首先.focus不是触发日期选择器的首选方式。首选方法是使用如下所示的 datapicker show 方法.datepicker('show');。所以在这个例子中，我们将使用它。

接下来，我们需要确保'show'在 min date 命令之后发生。而且因为该命令没有回调，我将使用 setTimeout

$( "#dateFrom" ).datepicker({
    minDate: 0, 
    maxDate: "+2Y",
    showWeek: true,
    weekHeader: 'Wk',
    onSelect: function( selectedDate ) {
        $( "#dateTo" ).datepicker("option", "minDate", selectedDate );
        setTimeout(function(){
            $( "#dateTo" ).datepicker('show');
        }, 16);     
    }
});

$( "#dateTo" ).datepicker({
    maxDate: "+2Y",
    showWeek: true,
    weekHeader: 'Wk'
});

你为什么说16ms？因为它可能是最长的延迟而不显示在屏幕上。出于这个原因，16ms 是默认的 jquery 动画间隔。

于 2012-07-25T15:51:36.933 回答
3 
$( "#dateTo" ).datepicker("option", "minDate", selectedDate ).focus(0);
于 2012-07-25T15:47:58.800 回答
0

我的建议是允许用户在任一日期选择器中选择他们想要的任何日期，然后在选择日期后对两个文本框进行验证。

从第一个 datepicker 中的值设置第二个 datepicker 中的日期范围的问题是，如果用户选择了 7 月 21 日，那么第二个 datepicker 将从 July 21 开始，但是当他们去更改第一个日期选择器到 7 月 1 日，第二个日期选择器将停留在 7 月 21 日之后的日期

于 2012-07-25T15:47:23.723 回答