使用bootstrap-datepicker选择联动日期时
2021-01-23 本文已影响0人
Tokeme
有时候需要选一个日期范围,又不是date-range这种情况的,使用如下设置实现相应功能:
image.png$('.start_date, .end_date').datepicker({
language: 'zh-CN',
autoclose: true,
clearBtn: true,
endDate: new Date(),
todayHighlight: true,
});
$('.start_date').on('changeDate', function (e) {
var tmp = $('.start_date').val();
var enddate1 = moment(tmp).add(15, 'days').isBefore(moment()) ? moment(tmp).add(15, 'days').format('YYYY-MM-DD'): new Date();
$('.end_date').datepicker('setStartDate', tmp);
$('.end_date').datepicker('setEndDate', enddate1);
if(moment(enddate1).isBefore($('.end_date').val())){
$('.end_date').datepicker('show');
}
if(moment($('.end_date').val()).isBefore(moment(tmp))){
// $('.end_date').val('');
$('.end_date').datepicker('show'); //选出日期不规范时,强行弹框让其重选
}
});
根据起始日期的变化,来控制结束日期的选择范围,从而避免用户选出错误的时间范围。