31

我对 jQuery Datepicker 有一个特殊的问题。我可以轻松添加日期范围,但我希望可选范围根据用户选择的事件而改变。

因此,如果他们选择事件 #1,他们只能从事件 #1 的日期范围中选择日期。

我编写了一个简单的小函数,每当用户选择一个新事件时都会调用它,但它只显示最初设置的 minDate/maxDate 值。

function datepicker(startDate, endDate) {
  $( "#date" ).datepicker({
    inline: true,
    minDate: new Date(startDate),
    maxDate: new Date(endDate),
    dateFormat: 'dd/mm/yy' 
  });
}

我在$('#date').datepicker('remove');再次调用上述函数之前尝试过调用,看看它是否创建了一个具有正确日期的新实例,但它似乎不起作用。

我已经通过开发人员工具检查了所有数据,并且所有内容都被正确调用和传递。我能做些什么来使这项工作按我的意愿工作吗?

4

5 回答 5

72

你有几个选择...

1)你需要调用的destroy()方法不是remove()这样......

$('#date').datepicker('destroy');

然后调用您的方法来重新创建datepicker对象。

object2)您可以通过更新现有的属性

$('#date').datepicker('option', 'minDate', new Date(startDate));
$('#date').datepicker('option', 'maxDate', new Date(endDate));

或者...

$('#date').datepicker('option', { minDate: new Date(startDate),
                                  maxDate: new Date(endDate) });
于 2013-04-28T21:15:48.127 回答
10

对于从/到日期,这是我如何根据在另一个日期选择器中输入的日期来限制日期。效果很好:

function activateDatePickers() {
    $("#aDateFrom").datepicker({
        onClose: function() {
            $("#aDateTo").datepicker(
                    "change",
                    { minDate: new Date($('#aDateFrom').val()) }
            );
        }
    });
    $("#aDateTo").datepicker({
        onClose: function() {
            $("#aDateFrom").datepicker(
                    "change",
                    { maxDate: new Date($('#aDateTo').val()) }
            );
        }
    });
}
于 2014-02-04T00:29:16.973 回答
7
$(document).ready(function() {
$("#aDateFrom").datepicker({
    onSelect: function() {
        //- get date from another datepicker without language dependencies
        var minDate = $('#aDateFrom').datepicker('getDate');
        $("#aDateTo").datepicker("change", { minDate: minDate });
    }
});

$("#aDateTo").datepicker({
    onSelect: function() {
        //- get date from another datepicker without language dependencies
        var maxDate = $('#aDateTo').datepicker('getDate');
        $("#aDateFrom").datepicker("change", { maxDate: maxDate });
    }
});
});
于 2015-06-09T17:56:26.350 回答
1

我已经使用这个更改了日期时间选择器的最小日期属性

$('#date').data("DateTimePicker").minDate(startDate);

我希望这对某人有所帮助!

于 2019-02-20T06:27:27.673 回答
0

我知道你正在使用 Datepicker,但对于像我这样只使用 HTML5 输入日期的人来说,有一个例子可以做到这一点: JSFiddle Link

$('#start_date').change(function(){
  var start_date = $(this).val();
  $('#end_date').prop({
    min: start_date
  });
});


/*  prop() method works since jquery 1.6, if you are using a previus version, you can use attr() method.*/
于 2017-04-04T03:48:58.393 回答