53

嗨,我想将 jQuery datepicker 中的最小日期设置为 (1999-10-25)。所以我尝试了下面的代码它不起作用。

$(function () {
    $('#datepicker').datepicker({
        dateFormat: 'yy-mm-dd',
        showButtonPanel: true,
        changeMonth: true,
        changeYear: true,
        showOn: "button",
        buttonImage: "images/calendar.gif",
        buttonImageOnly: true,
        minDate: new Date(1999, 10 - 1, 25),
        maxDate: '+30Y',
        inline: true
    });
});

如果我将最小年份更改为高于 2002 年,它将正常工作,但如果我指定最小年份小于 2002 年(如上面的示例 1999 年),它将只显示到 2002 年。
我正在使用jquery-1.7.1.min.jsand jquery-ui-1.8.18.custom.min.js

4

7 回答 7

104
$(function () {
    $('#datepicker').datepicker({
        dateFormat: 'yy-mm-dd',
        showButtonPanel: true,
        changeMonth: true,
        changeYear: true,
yearRange: '1999:2012',
        showOn: "button",
        buttonImage: "images/calendar.gif",
        buttonImageOnly: true,
        minDate: new Date(1999, 10 - 1, 25),
        maxDate: '+30Y',
        inline: true
    });
});

刚刚添加了年份范围选项。它应该可以解决问题

于 2012-04-13T11:13:43.887 回答
17

问题是“yearRange”的默认选项是 10 年。

所以2012 - 10 = 2002

因此,将 yearRange 更改为c-20:c或仅更改为 1999 ( yearRange: '1999:c'),并将其与限制日期 (mindate、maxdate) 结合使用。

欲了解更多信息:https ://jqueryui.com/demos/datepicker/#option-yearRange


参见示例:(JSFiddle

你的代码加上:

$(function () {
    $('#datepicker').datepicker({
        dateFormat: 'yy-mm-dd',
        showButtonPanel: true,
        changeMonth: true,
        changeYear: true,
        showOn: "button",
        buttonImage: "images/calendar.gif",
        buttonImageOnly: true,
        minDate: new Date(1999, 10 - 1, 25),
        maxDate: '+30Y',
        yearRange: '1999:c',
        inline: true
    });
});
于 2012-04-13T11:11:55.217 回答
5

工作演示:http: //jsfiddle.net/femy8/

现在日历只会转到 1999 年 10 月 25 日的最小值。

单击图像,即显示日历的文本框旁边的小图标。您可以尝试选择直到 1999 年,但选择的最短日期是 1999 年 10 月 25 日。这是您想要的。

这会有所帮助,祝你好运!:) 干杯!

jQuery代码

$(".mypicker").datepicker({
    changeYear: true,
    dateFormat: 'yy-mm-dd',
    showButtonPanel: true,
    changeMonth: true,
    changeYear: true,
    showOn: "button",
        buttonImage: "images/calendar.gif",
        buttonImageOnly: true,
        minDate: new Date('1999/10/25'),
        maxDate: '+30Y',
        inline: true
});


​
于 2012-04-13T11:07:45.763 回答
2

只是想为未来的程序员添加这个。

此代码限制日期最小值和最大值。通过将当前年份作为最大年份来完全控制年份。

希望这对任何人都有帮助。

这是代码。

var dateToday = new Date();
var yrRange = '2014' + ":" + (dateToday.getFullYear());

$(function () {
    $("[id$=txtDate]").datepicker({
        showOn: 'button',
        changeMonth: true,
        changeYear: true,
        showButtonPanel: true,
        buttonImageOnly: true,
        yearRange: yrRange,
        buttonImage: 'calendar3.png',
        buttonImageOnly: true,
        minDate: new Date(2014,1-1,1),
        maxDate: '+50Y',
        inline:true
    });
});
于 2015-04-13T00:58:12.247 回答
2

以防万一,例如,您需要输入最小日期、最近 3 个月和接下来 3 个月的最大日期

$('#id_your_date').datepicker({ 
   maxDate: '+3m',
   minDate: '-3m'
 });
于 2017-07-14T14:12:00.447 回答
0

像这样试试

<script>

  $(document).ready(function(){
          $("#order_ship_date").datepicker({
           changeMonth:true,
           changeYear:true,           
            dateFormat:"yy-mm-dd",
            minDate: +2,
        });
  }); 


</script>

html代码如下

<input id="order_ship_date"  type="text" class="input" style="width:80px;"  />
于 2015-04-15T09:37:59.403 回答
0

基本上,如果您已经指定了年份范围,则无需使用mindatemaxdate如果只需要年份

于 2017-03-04T16:45:19.773 回答