在jquery datepicker中设置最小日期

时间:2012-04-13 10:46:09

标签: jquery jquery-ui jquery-ui-datepicker

您好我想在我的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.js和jquery-ui-1.8.18.custom.min.js。

7 个答案:

答案 0 :(得分:89)

$(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
    });
});

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

答案 1 :(得分:14)

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

所以2012 - 10 = 2002

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

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


参见示例:http://jsfiddle.net/kGjdL/

你的代码加上:

$(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
    });
});

答案 2 :(得分:1)

Hiya 工作演示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
});


​

答案 3 :(得分:1)

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

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

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

这是代码。

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
    });
});

答案 4 :(得分:1)

以防万一,例如你需要设置一个最小日期,最后3个月和最近3个月的最后日期

$('#id_your_date').datepicker({ 
   maxDate: '+3m',
   minDate: '-3m'
 });

答案 5 :(得分: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;"  />

答案 6 :(得分:0)

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