jQuery datepicker 即时设置选定日期答案

【问题标题】：jQuery datepicker set selected date, on the flyjQuery datepicker 即时设置选定日期
【发布时间】：2010-10-11 00:36:09
【问题描述】：

如何动态更改 jquery 日期选择器的选定日期？我说过创建了一个内联日期选择器。然后过了一段时间，我想在那里反映一个不同的日期，而不是从头开始重新创建日期选择器。

试过setDate方法，还是不行，doc的文档不多。

还有另一个（扩展？）插件here，但我想使用 jquery.ui.all.js 附带的插件。

【问题讨论】：

标签： jquery-ui datepicker

【解决方案1】：

您使用的是什么版本的 jQuery-UI？我已经使用 1.6r6、1.7 和 1.7.1 测试了以下内容，并且可以正常工作：

//Set DatePicker to October 3, 2008
$('#dateselector').datepicker("setDate", new Date(2008,9,03) );

【讨论】：

如果 setDate 不起作用，请使用 defaultDate 而不是 setDate。
但对我来说，这两种方式都不起作用。日期已更改。但所选日期未出现在日历中。它只显示今天突出显示。
这不适用于 Ver 3.1+。使用 $('#picker').data('daterangepicker').setStartDate('03/03/2021')

【解决方案2】：

如果设置了 minDate 或 maxDate 选项，请检查您尝试设置的日期是否在允许的日期范围内。

【讨论】：

【解决方案3】：

这个例子展示了如何使用下拉日历中的默认值和文本框中的值。它还显示了如何将默认值设置为上一个日期。

selectedDate 是另一个保存日历控件当前选定日期的变量

    var date = new Date();
    date.setDate(date.getDate() - 1);

    $("#datepicker").datepicker({
        dateFormat: "yy-mm-dd",
        defaultDate: date,
        onSelect: function () {
            selectedDate = $.datepicker.formatDate("yy-mm-dd", $(this).datepicker('getDate'));
        }
    });

    $("#datepicker").datepicker("setDate", date);

【讨论】：

【解决方案4】：

请注意，对于 Keith Wood (http://keith-wood.name/datepickRef.html) 的 DatePicker，以下工作 - 请注意默认日期的设置是最后一个：

    $('#datepicker').datepick({
        minDate: 0,
        maxDate: '+145D',
        multiSelect: 7,
        renderer: $.datepick.themeRollerRenderer,
        ***defaultDate: new Date('1 January 2008')***
    });

【讨论】：

【解决方案5】：

$('.date-pick').datePicker().val(new Date()).trigger('change')

最后，这就是我最近几个小时寻找的东西！我需要启动更改，而不仅仅是在文本字段中设置日期！

【讨论】：

应该是.datepicker() 而不是.datePicker()

【解决方案6】：

由于某种原因，在某些情况下我无法使 setDate 起作用。

我发现的一种解决方法是简单地更新给定输入的 value 属性。当然日期选择器本身不会更新，但如果您只是要显示日期，它可以正常工作。

var date = new Date(2008,9,3);
$("#your-input").val(date.getMonth()+"/"+date.getDate()+"/"+date.getFullYear());
// Will display 9/3/2008 in your #your-input input

【讨论】：

几个月有减一，所以需要(date.getMonth()+1)
setDate 如果在初始选项中设置将不起作用，之后我将它与 .datepicker('setDate', ... ) 链接起来

【解决方案7】：

这是一个旧线程，但我只想提供一些信息，我是如何使用的。如果您想设置今天的日期，您可以像下面这样简单地应用它。

 $("#datepickerid").datepicker("setDate", "0");

如果您想设置当前日期之前/之后的几天，请使用符号 -/+ 表示您想要多少天，如下所示。

 $("#datepickerid").datepicker("setDate", "-7");
 $("#datepickerid").datepicker("setDate", "+5");

【讨论】：

【解决方案8】：

这对我有用：

$("#dateselector").datepicker("option", "defaultDate", new Date(2008,9,3));

【讨论】：

【解决方案9】：

setDate 似乎只是 jquery UI 中使用的内联日期选择器的问题，具体错误是 InternalError: too much recursion。

【讨论】：

【解决方案10】：

在 Html 中，您可以使用这样的日期选择器添加输入字段

<input class="form-control date-picker fromDates" id="myDate" type="text">

然后在 java 脚本中，初始化您的日期选择器并将您的值设置为这样的日期，

$('.fromDates').datepicker({
                maxDate: '0',
                dateFormat: "dd/mm/yy",
                changeYear: true,
                changeMonth: true,
                yearRange: "-100:+0"
            });

var myDateVal = moment('${value}').format('DD/MM/YYYY');
$('#myDate').datepicker().datepicker('setDate', myDateVal );

（这里的fromdate属性显示当前日期之前的日期）

【讨论】：

【解决方案11】：

请在下面找到它对设置数据功能有很大帮助

$('#datepicker').datepicker({dateFormat: 'yy-mm-dd'}).datepicker('setDate', '2010-07-25');

【讨论】：

【解决方案12】：

var dt = new Date();
var renewal = moment(dt).add(1,'year').format('YYYY-MM-DD');
// moment().add(number, period)
// moment().subtract(number, period)
// period : year, days, hours, months, week...

【讨论】：

在 Stack Overflow 上不鼓励仅使用代码的答案，因为它们没有解释它如何解决问题。请编辑您的答案以解释代码的作用以及它如何回答问题，以便它对其他用户以及 OP 也有用。

【解决方案13】：

我在 setDate 方法上也遇到了很多麻烦。似乎只适用于 v1。然而，似乎有效的是使用 dpSetSelected 方法：

    $("#dateselector").dpSetSelected(new Date(2010, 0, 26).asString());

祝你好运！

【讨论】：

【解决方案14】：

或者你可以简单地拥有

$('.date-pick').datePicker().val(new Date()).trigger('change')

【讨论】：

应该是.datepicker() 而不是.datePicker()。