minDate 和 maxDate 选项在日期选择器中不起作用
minDate and maxDate options are not working in datepicker
我在我的项目中使用 "datepicker" 插件,它设置为十年视图,我想禁用未来日期,为此我使用了 maxDate
选项,但它不是工作,我的代码:
$('#data_1 .input-group.date').datepicker({
todayBtn: "linked",
maxDate: "0",
keyboardNavigation: false,
forceParse: false,
calendarWeeks: true,
autoclose: true
});
尝试使用 0
和 new Date
试试下面的代码:
var today = new Date();
$('#data_1 .input-group.date').datepicker({
todayBtn: "linked",
endDate: "today",
maxDate: today
keyboardNavigation: false,
forceParse: false,
calendarWeeks: true,
autoclose: true
});
你也可以试试:
maxDate: 0
注意 bootstrap-datepicker has no maxDate
option, you have to use endDate
.
这是一个工作示例:
$("#datepicker").datepicker({
todayBtn: "linked",
endDate: new Date(),
keyboardNavigation: false,
forceParse: false,
calendarWeeks: true,
autoclose: true
});
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.css" rel="stylesheet"/>
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.6.4/css/bootstrap-datepicker3.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.6.4/js/bootstrap-datepicker.js"></script>
<input type="text" class="form-control" id="datepicker">
添加属性 data-date-end-date="0d"
对我有用:
<input type="text" id="birthDay" data-date-end-date="0d">
如果您尝试使用日历作为开始日期和结束日期,那么这将对您有所帮助:)
`$("#from").datepicker({
format : 'dd-mm-yyyy',
endDate: '<?php echo $to; ?>',
changeMonth: false,
changeYear: false,
prevText: '<i class="fa fa-chevron-left"></i>',
nextText: '<i class="fa fa-chevron-right"></i>',
onClose: function (selectedDate) {
$("#to").datepicker("option", "startDate", selectedDate);
}
});
$("#to").datepicker({
format : 'dd-mm-yyyy',
startDate: '<?php echo $from; ?>',
changeMonth: false,
changeYear: false,
prevText: '<i class="fa fa-chevron-left"></i>',
nextText: '<i class="fa fa-chevron-right"></i>',
onClose: function (selectedDate) {
$("#from").datepicker("option", "endDate", selectedDate);
}
});`
我在我的项目中使用 "datepicker" 插件,它设置为十年视图,我想禁用未来日期,为此我使用了 maxDate
选项,但它不是工作,我的代码:
$('#data_1 .input-group.date').datepicker({
todayBtn: "linked",
maxDate: "0",
keyboardNavigation: false,
forceParse: false,
calendarWeeks: true,
autoclose: true
});
尝试使用 0
和 new Date
试试下面的代码:
var today = new Date();
$('#data_1 .input-group.date').datepicker({
todayBtn: "linked",
endDate: "today",
maxDate: today
keyboardNavigation: false,
forceParse: false,
calendarWeeks: true,
autoclose: true
});
你也可以试试:
maxDate: 0
注意 bootstrap-datepicker has no maxDate
option, you have to use endDate
.
这是一个工作示例:
$("#datepicker").datepicker({
todayBtn: "linked",
endDate: new Date(),
keyboardNavigation: false,
forceParse: false,
calendarWeeks: true,
autoclose: true
});
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.css" rel="stylesheet"/>
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.6.4/css/bootstrap-datepicker3.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.6.4/js/bootstrap-datepicker.js"></script>
<input type="text" class="form-control" id="datepicker">
添加属性 data-date-end-date="0d"
对我有用:
<input type="text" id="birthDay" data-date-end-date="0d">
如果您尝试使用日历作为开始日期和结束日期,那么这将对您有所帮助:)
`$("#from").datepicker({
format : 'dd-mm-yyyy',
endDate: '<?php echo $to; ?>',
changeMonth: false,
changeYear: false,
prevText: '<i class="fa fa-chevron-left"></i>',
nextText: '<i class="fa fa-chevron-right"></i>',
onClose: function (selectedDate) {
$("#to").datepicker("option", "startDate", selectedDate);
}
});
$("#to").datepicker({
format : 'dd-mm-yyyy',
startDate: '<?php echo $from; ?>',
changeMonth: false,
changeYear: false,
prevText: '<i class="fa fa-chevron-left"></i>',
nextText: '<i class="fa fa-chevron-right"></i>',
onClose: function (selectedDate) {
$("#from").datepicker("option", "endDate", selectedDate);
}
});`