如何日期选择器仅选择未来日期并在 JQuery 和 CSS 中禁用过去日期?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/31607485/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to Datepicker picks future dates only and disable past date in JQuery and CSS?
提问by fatherazrael
Which class should be used for datepicker to use future dates only?
哪个类应该用于 datepicker 以仅使用未来日期?
<form:input path="FutureDato" type="date" class="datepicker maxDateToday hasDatepicker" />
Note: The code is written by someone else. The above code does not allow to enter future date or you can say disable future dates on calendar click. I want code to disable past dates and show future date years only. I am unable to get how these classes (datepicker, maxDateToday) worked here; unable to find it in CSS. I do not know whether above execute by JQuery; if yes then i am unable to search the same. If such classes are predefined then could you please help me finding the class?
注意:代码是别人写的。上面的代码不允许输入未来日期,或者您可以在日历点击时禁用未来日期。我希望代码禁用过去的日期并仅显示未来的日期年份。我无法了解这些类(datepicker、maxDateToday)在这里是如何工作的;无法在 CSS 中找到它。我不知道上面是否由 JQuery 执行;如果是,那么我无法搜索相同的内容。如果这些类是预定义的,那么你能帮我找到这个类吗?
回答by adeneo
To make any past dates unselectable, you first have to find the instantiation of the datepicker, and set the minDate
setting to zero.
要使任何过去的日期无法选择,您首先必须找到日期选择器的实例,并将设置minDate
设置为零。
$('element').datepicker({
minDate : 0
});
回答by Nilesh Sonkusare
Best solution for disable past dates and picks only future dates is:
禁用过去日期并仅选择未来日期的最佳解决方案是:
Try this, it is working in my case:
试试这个,它在我的情况下工作:
$( ".selector" ).datepicker({
startDate: new Date()
});
回答by Ankur Mahajan
Use datepicker's minDate() method you can find api details http://api.jqueryui.com/datepicker/
使用 datepicker 的 minDate() 方法可以找到 api 详细信息http://api.jqueryui.com/datepicker/
$( ".selector" ).datepicker({
minDate: new Date()
});
for this first you have to import jQuery-UI script https://code.jquery.com/ui/
为此,您首先必须导入 jQuery-UI 脚本https://code.jquery.com/ui/
I hope this will work.
我希望这会奏效。
回答by Garconis
I've found, in my particular case, that it only worked if using setDefaults
. For example:
我发现,在我的特殊情况下,它只有在使用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>