Question

我在网页上使用Bootstrap-datepicker。我目前正在使用它：

$("input#txtInspectionDate").datepicker({
        startDate: dateArray[0],
        endDate: dateArray[maxDateIndex],
        daysOfWeekDisabled: daysWeekend,
        datesDisabled: datesDisabled
    });

dateArray是一系列可能的日期。 startDate设置为数组中的最低值endDate为最高值。然后我使用datesDisabled指定我们办公室的假期，以便人们在我们关闭的几天内不安排事情。

任何人都可以想到一种方法来告诉datepicker哪些日期可以使用？因此，我只想说，“使用日期1，日期2，日期3，日期4，日期5”，而不是告诉它一个范围然后去除周末和假期。我们有一个生成可用日期的Web服务，因此我可以很容易地获得这样的数组：

var validDates = ['12/2/2015','12/3/2015','12/4/2015','12/5/2015','12/6/2015'];

Answer 1

你可以这样做：

＆＃13;

$.fn.extend({
  datepickerValidDates: function(validDates) {
    validDates = validDates.sort(function(lhs, rhs) {
      return new Date(lhs) > new Date(rhs);
    });

    var startDate = validDates[0];
    var endDate = validDates[validDates.length - 1];

    var datesDisabled = [],
      currDate = new Date(startDate),
      lastDate = new Date(endDate);

    while (currDate <= lastDate) {
      var dateString = (1 + currDate.getMonth()) + "/" + currDate.getDate() + "/" + currDate.getFullYear();
      if (validDates.indexOf(dateString) === -1)
        datesDisabled.push(dateString);
      currDate.setDate(currDate.getDate() + 1);
    }

    return $(this).datepicker({
      startDate: startDate,
      endDate: endDate,
      datesDisabled: datesDisabled
    })
  }
});

var validDates = ['12/14/2015', '12/1/2015', '12/4/2015', '12/5/2015', '12/6/2015'];
$(".datepicker").datepickerValidDates(validDates);

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://eternicode.github.io/bootstrap-datepicker/bootstrap-datepicker/js/bootstrap-datepicker.js"></script>

<link rel="stylesheet" type="text/css" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="https://eternicode.github.io/bootstrap-datepicker/bootstrap-datepicker/css/datepicker.css">
<input class="datepicker">

＆＃13;

如何指定我想在Bootstrap Datepicker中有效的日期？

1 个答案: