javascript - jQuery 日期选择器突出显示范围循环

Question

我想在 jQuery 日期选择器上突出显示日期范围。

  var dates = new Array();
  dates[0] = [new Date(2014,2,23), new Date(2014,2,30)];
  dates[1] = [new Date(2014,2,13), new Date(2014,2,20)];

  $(function() {
    $('#datepicker').datepicker({
        numberOfMonths: 1,
        minDate: '-0m',
        beforeShowDay: function (date) {
            for (i=0;i<dates.length;i++) {
                var date1 = dates[i][0];
                var date2 = dates[i][1];
                return [true, date1 && ((date.getTime() == date1.getTime()) || (date2 && date >= date1 && date <= date2)) ? "dp-highlight" : ""];
            }
        }
    })
  });

上面的方法不起作用，因为只有一个范围可见。如何进行循环以突出显示多个范围？感谢您的帮助!

Fiddle

Answer 1

问题是你在循环内有 return因此，在第一个循环结束时，函数返回 true 或 false

你应该这样做:

var dates = new Array();
  dates[0] = [new Date(2014,2,23), new Date(2014,2,30)];
  dates[1] = [new Date(2014,2,13), new Date(2014,2,20)];

  $(function() {
    $('#datepicker').datepicker({
        numberOfMonths: 1,
        minDate: '-0m',
        beforeShowDay: function (date) {
            var bool = true;
            for (i=0;i<dates.length;i++) {
                var date1 = dates[i][0];
                var date2 = dates[i][1];
                bool = bool && date1 && ((date.getTime() == date1.getTime()) || (date2 && date >= date1 && date <= date2)) ? "dp-highlight" : "";
            }
            return bool;
        }
    })
  });