在 jQuery datepicker 中设置最小日期

Posted 2023-05-07

【中文标题】在 jQuery datepicker 中设置最小日期

【英文标题】：Setting min date in jQuery datepicker

【发布时间】：2012-04-25 17:33:56

【问题描述】：

您好，我想在我的 jQuery 日期选择器中将最小日期设置为 (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。

【问题讨论】：

要在初始化后设置，使用$('#datepicker').datepicker( "option", "minDate", new Date( 1999, 10 - 1, 25 ) )。

【参考方案1】：

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

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

【讨论】：

帮帮我，如何在odoo的后端设置。

如果我有一个“2019-07-12”字符串值怎么办？如何将其设置到 minDate 属性中？

回答费尔南多，是的，您可以使用普通的日期字符串。您可以从下面使用 jsfiddle 进行测试：jsfiddle.net/femy8

【参考方案2】：

问题是“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
    );
);

【参考方案3】：

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


​

【参考方案4】：

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

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

【参考方案5】：

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

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

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

这是代码。

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

【参考方案6】：

这样试试

<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;"  />

【讨论】：

能否请您详细说明您的答案，添加更多关于您提供的解决方案的描述？

【参考方案7】：

基本上，如果您已经指定了年份范围，则无需使用 mindate 和 maxdate 如果只需要年份