Bootstrap 日期选择器中的多个日期答案

【问题标题】：Multiple dates in Bootstrap date-pickerBootstrap 日期选择器中的多个日期
【发布时间】：2014-09-16 16:52:43
【问题描述】：

我正在尝试在Boostrap-Datepicker.中选择多个日期

我已经初始化了日期选择器，很好。

$('#datepicker2').datepicker();

现在我想在日历上select multiple dates：

$('#datepicker2').datepicker('setDate', [new Date(2014, 2, 5),new Date(2014, 3, 5)]);

它不工作。未记录任何错误，但未选择日期。

编辑：我使用的日期选择器版本在多日期方面存在一些问题，我使用了以前的版本并且它可以工作 - 可能是版本问题

这很好用：

$('#datepicker2').datepicker('setDate', new Date(2014, 2, 5));

【问题讨论】：

这是开始日期/结束日期的情况吗？如果是这样，您可以考虑使用 daterangepicker
不，我只需要照亮某些日期
貌似有单独的setDates方法
是的，这就是我使用的......我的论点格式是否遗漏了什么？
在您在问题中提供的代码中，您使用了setDate 而不是setDates。注意复数

标签： jquery twitter-bootstrap datepicker

【解决方案1】：

需要先通过选项将你的日期选择器定义为多日期选择器。

$('#datepicker2').datepicker({
  multidate: true
});

然后您可以通过setDates 方法设置您的日期：

$('.date').datepicker({
    multidate: true
});

$('.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"/>
<input type="text" class="form-control date"/>

【讨论】：

【解决方案2】：

您还可以设置要选择的日期数量限制。请参阅下面的示例，您最多只能选择 5 个日期。

示例

$("#Txt_Date").datepicker({
    format: 'd-M-yyyy',
    inline: false,
    lang: 'en',
    step: 5,
    multidate: 5,
    closeOnDateSelect: true
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.8.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"/>


<input type="text" id="Txt_Date" placeholder="Choose Date" style="cursor: pointer;">

【讨论】：