如何使用JQuery和CSS实现日期选择器只能选择未来日期且禁用过去日期？

Question

应该使用哪个类来选择只能使用未来日期的日期选择器？

<form:input path="FutureDato" type="date" class="datepicker maxDateToday hasDatepicker" />

注意：该代码是由他人编写的。上述代码不允许输入未来的日期，或者说在日历点击时禁用未来的日期。我希望能够禁用过去的日期并仅显示未来日期年份。我无法理解这些类（datepicker、maxDateToday）在此处是如何工作的；我在CSS中找不到它们。我不知道上面的代码是否由JQuery执行；如果是，则我无法搜索相同的内容。如果这些类是预定义的话，您能否帮助我找到这个类？

- fatherazrael

---

代码的开发者是其他人，目前无法联系到他。我需要找到这个人，但有很多JS文件。我在Netbeans中打开了代码。除了datepicker之外，您能推荐其他常用的关键字吗？ - fatherazrael

不是的，通常是 $(element).datepicker({settings})。 - adeneo

它说maxDate: 0，我认为我们将使用minDate=0。 - fatherazrael

https://dev59.com/sXI-5IYBdhLWcg3wlpQM - adeneo

请问您能否将其放到“minDate: 0”的答案中？我会接受那个作为答案。 - fatherazrael

Answer 1

要使任何过去的日期无法选择，您首先需要找到datepicker的实例化，并将minDate设置为0。

$('element').datepicker({
    minDate : 0
});

- adeneo

---

如果有人想要限制日期选择为未来日期但是在今天之后，可以使用minDate: '+1D'（或+1w等）。 - pambuk

Answer 2

禁用过去日期并仅选择未来日期的最佳解决方案是：

尝试这个，在我的案例中它有效：

$( ".selector" ).datepicker({ 
    startDate: new Date()   
});

- Nilesh Sonkusare

Answer 3

使用 datepicker 的 minDate() 方法可以设置最小日期，具体 API 细节请参见http://api.jqueryui.com/datepicker/

$( ".selector" ).datepicker({
     minDate: new Date()
});

首先，您需要导入jQuery-UI脚本 https://code.jquery.com/ui/

希望这可以解决问题。

- Ankur Mahajan

Answer 4

要使任何过去的日期无效或仅适用于未来日期，您首先必须找到日期选择器的实例，并将startDate设置为'+0d'。

$('element').datepicker({
    startDate: '+0d'
});

- Abhishek Kanrar

Answer 5

在我的情况下，我发现只有使用setDefaults才能起作用。例如：

<script type="text/javascript">
    jQuery( document ).ready( function ( e ) {
        if ( jQuery( '.your-date-picker-selector' ).length ) {
            jQuery.datepicker.setDefaults({
                minDate: 0,
                maxDate: "+12m"
            });
        }
    });
</script>

- Garconis