Datepicker：MultiDate 不适用于 maxDate 和 minDate

如何解决Datepicker：MultiDate 不适用于 maxDate 和 minDate

我想开发一个日期选择器，我们可以在 minDate 和 maxDate 之间选择多个随机日期，但是对于 minDate 和 maxDate，multidate 不起作用。

$('.date').datepicker({
    multidate: true,minDate: -3,maxDate: 2
});

$('.date').datepicker('setDates',[new Date(2014,2,5),new Date(2014,3,5)])

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.3.0/js/bootstrap-datepicker.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.8.0/css/bootstrap-datepicker.css" rel="stylesheet"/>

解决方法

minDate 和 maxDate 在 Bootstrap-datepicker 中不存在，但在另一个插件 jquery Datepicker 中，

因此要在 bootstrap-datepicker 中使用相同的逻辑，您必须使用选项 startDate 和 endDate。

所以 minDate:-3 变成 startDate: new Date(new Date().setDate(new Date().getDate() - 3))

然后maxDate:2变成endDate: new Date(new Date().setDate(new Date().getDate() + 2))

$('.date').datepicker({
    multidate: true,startDate: settingDate(-3),endDate: settingDate(+2)
});

/* if you want to change the start and end Date (MM,DD,YYYY)
  $('.date').datepicker('setStartDate',"04/14/2020");
  $('.date').datepicker('setEndDate',"05/10/2020");
*/


function settingDate(num){
  return new Date(new Date().setDate(new Date().getDate() + num))
}

<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.9.0/js/bootstrap-datepicker.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.9.0/css/bootstrap-datepicker.min.css">

<div class="input-group date" data-provide="datepicker">
  <input type="text" class="form-control">
  <div class="input-group-addon">
    <span class="glyphicon glyphicon-th"></span>
  </div>
</div>

这是当前日期的示例，但您可以根据所选日期进行调整。

在这种情况下，您必须使用方法：setStartDate 和 setEndDate（请参阅 THAT）来设置其他限制以选择日期..