Datepicker 如何仅选择未来日期并禁用 JQuery 和 CSS 中的过去日期？

Posted 2023-05-07

【中文标题】Datepicker 如何仅选择未来日期并禁用 JQuery 和 CSS 中的过去日期？

【英文标题】：How to Datepicker picks future dates only and disable past date in JQuery and CSS?

【发布时间】：2015-10-14 22:43:01

【问题描述】：

应该使用哪个类让 datepicker 只使用未来的日期？

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

注意：代码是别人写的。上面的代码不允许输入未来的日期，或者你可以说在日历点击上禁用未来的日期。我希望代码禁用过去的日期并仅显示未来的日期年份。我无法了解这些类（datepicker、maxDateToday）是如何在这里工作的；无法在 CSS 中找到它。我不知道上面是否由 JQuery 执行；如果是，那么我无法搜索相同的内容。如果这些类是预定义的，那么您能帮我找到类吗？

【问题讨论】：

没有特殊的类，你可以在实例化日期选择器时在设置中指定它。

那么这段代码一定存在于一些jquery中？

在某个地方有创建日期选择器的 javascript，并且有一些设置可以设置最大和最小日期。

代码的开发者是别人，没有联系。我需要找到它并且有很多js文件。在 Netbeans 中打开代码。除了 datepicker 之外，还有什么著名的关键词可以推荐吗？

不，一般是$(element).datepicker(settings)

【参考方案1】：

要使任何过去的日期无法选择，您首先必须找到日期选择器的实例，并将 minDate 设置为零。

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

【讨论】：

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

【参考方案2】：

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

试试这个，它在我的情况下工作：

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

【参考方案3】：

使用datepicker的minDate()方法可以找到api详情http://api.jqueryui.com/datepicker/

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

首先你必须导入 jQuery-UI 脚本https://code.jquery.com/ui/

我希望这会奏效。

【参考方案4】：

我发现，在我的特殊情况下，它只有在使用 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>

【参考方案5】：

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

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