Question

我正在使用jquery ui daterange datepicker http://jqueryui.com/demos/datepicker/#date-range我的代码低于它几乎是默认的初始化。我希望我的“to”输入字段值为今天的日期，并且“from”输入字段值为30天之前。我还没有找到动态设置这些输入值，任何帮助的赞赏

由于

<div id="date-wrapper">
<script>
$(function() {
    var dates = $( "#from, #to" ).datepicker({
        defaultDate: "+1w",
        dateFormat: "M d, yy",
        changeMonth: true,
        numberOfMonths: 1,
        onSelect: function( selectedDate ) {
            var option = this.id == "from" ? "minDate" : "maxDate",
                instance = $( this ).data( "datepicker" ),
                date = $.datepicker.parseDate(
                    instance.settings.dateFormat ||
                    $.datepicker._defaults.dateFormat,
                    selectedDate, instance.settings );
            dates.not( this ).datepicker( "option", option, date );
        }
    });
});
</script>
<label for="from"></label>
<input type="text" id="from" name="from"/><span style="font-weight:bold;font-size:15px;">-</span>
<label for="to"></label>
<input type="text" id="to" name="to"/>
</div>
</div>

Answer 1

您需要分别启动这两个字段。您可以将设置保存到对象以供重复使用。

JavaScript看起来像：

var settings = {
    dateFormat: "M d, yy",
    changeMonth: true,
    numberOfMonths: 1,
    onSelect: function(selectedDate) {
        var option = this.id == "from" ? "minDate" : "maxDate",
            instance = $(this).data("datepicker"),
            date = $.datepicker.parseDate(
            instance.settings.dateFormat || $.datepicker._defaults.dateFormat, selectedDate, instance.settings);
        $("#from, #to").not(this).datepicker("option", option, date);
    }
};
$("#to").datepicker(settings);
$("#from").datepicker($.extend({}, settings, { defaultDate: '-30d'}));

查看实际操作：http://jsfiddle.net/william/xtATL/。

修改：

您可以使用效用函数$.datepicker.formatDate(format, date, settings)来格式化输入中显示的日期：

$("#to").val(function() { return $.datepicker.formatDate('M d, yy', new Date(), settings); }); $("#from").val(function() { var thirtyDaysAgo = new Date().getTime() - 30 * (1000*60*60*24); return $.datepicker.formatDate('M d, yy', new Date(thirtyDaysAgo), settings); });

请参阅更新后的示例：http://jsfiddle.net/william/xtATL/4/。

Answer 2

在初始化datepicker之前设置输入中的日期（使用正确的日期格式），或者在初始化之后使用setDate方法（如果是datepicker）。例如。

var d = new Date（）; jQuery（“＃to）.datepicker（”setDate“，d）;

将jquery ui daterange选择器输入上的默认输入值设置为特定日期

2 个答案: