jQuery Datepicker在选择开始日期和结束日期时的问题



我正在使用jQuery Datepicker,我在jQuery中有相同的变化,但在这方面出了问题。

按我的要求正常工作,但当我在开始日期中从December 2020中选择日期时,所有结束日期的日期都被禁用。

只有当我选择2020年12月的日期时才会发生这种情况。

if (jQuery('#datetimepicker1').length > 0) {
jQuery('#datetimepicker1').datetimepicker({
lang: 'ch',
timepicker: false,
format: 'd/m/Y',
formatDate: 'Y/m/d',
maxDate: 0,
onChangeDateTime: function(dp, $input) {
var from = $input.val().split("/");
var f = new Date(from[2], from[1], from[0]);
f.setDate(f.getDate());
var datemin = f.getFullYear()+ "/" +f.getMonth()+ "/" +f.getDate();
var datestr= from[2]+ "/" +f.getMonth()+ "/" +from[0];
$("#datetimepicker2").datetimepicker({
lang: 'ch',
timepicker: false,
format: 'd/m/Y',
formatDate: 'Y/m/d',
changeMonth: f.getMonth(),
changeYear: f.getFullYear(),
minDate: new Date(datemin),
startDate:datemin,
});
}
});
}
if (jQuery('#datetimepicker2').length > 0) {
jQuery('#datetimepicker2').datetimepicker({
lang: 'ch',
timepicker: false,
format: 'd/m/Y',
formatDate: 'Y/m/d',
maxDate: 0,
});
}
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-datetimepicker/2.5.20/jquery.datetimepicker.css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-datetimepicker/2.5.20/jquery.datetimepicker.full.min.js"></script>

<input id="datetimepicker1" type="text" placeholder="Start Date"/>
<input id="datetimepicker2" type="text" placeholder="End Date"/>

Javascript月份是基于0的,但你的输入是基于1的,所以你需要转换

var f = new Date(from[2], from[1]-1, from[0]); 

由于没有第13个月,所以它失败了,所以"混乱"。

由于您不使用日期本身,而是将其重新格式化为字符串,因此还需要转换回以下几行:

var datemin = f.getFullYear()+ "/" +(f.getMonth()+1)+ "/" +f.getDate();
var datestr= from[2]+ "/" +(f.getMonth()+1)+ "/" +from[0];

if (jQuery('#datetimepicker1').length > 0) {
jQuery('#datetimepicker1').datetimepicker({
lang: 'ch',
timepicker: false,
format: 'd/m/Y',
formatDate: 'Y/m/d',
maxDate: 0,
onChangeDateTime: function(dp, $input) {
var from = $input.val().split("/");
var f = new Date(from[2], from[1]-1, from[0]);
f.setDate(f.getDate());
var datemin = f.getFullYear()+ "/" +(f.getMonth()+1)+ "/" +f.getDate();
var datestr= from[2]+ "/" +(f.getMonth()+1)+ "/" +from[0];
$("#datetimepicker2").datetimepicker({
lang: 'ch',
timepicker: false,
format: 'd/m/Y',
formatDate: 'Y/m/d',
changeMonth: f.getMonth(),
changeYear: f.getFullYear(),
minDate: new Date(datemin),
startDate:datemin,
});
}
});
}
if (jQuery('#datetimepicker2').length > 0) {
jQuery('#datetimepicker2').datetimepicker({
lang: 'ch',
timepicker: false,
format: 'd/m/Y',
formatDate: 'Y/m/d',
maxDate: 0,
});
}
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-datetimepicker/2.5.20/jquery.datetimepicker.css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-datetimepicker/2.5.20/jquery.datetimepicker.full.min.js"></script>

<input id="datetimepicker1" type="text" placeholder="Start Date"/>
<input id="datetimepicker2" type="text" placeholder="End Date"/>

最新更新