jquery datepicker突出显示两个日期之间的eventDates

时间:2015-10-02 20:53:02

标签: javascript jquery datepicker

请帮助我在jquery datepicker中解决以下问题

我想强调开始日期'09 / 01/2015'到结束日期'09 / 30/2015'而不是每天都添加,例如:

    eventDates[ new Date( '09/01/2015', 09/31/2015 )] = 'unavailable';

这就是我的代码:

    var eventDates = {};

    eventDates[ new Date( '09/01/2015' )] = 'unavailable';
    eventDates[ new Date( '09/02/2015' )] = 'unavailable';
    eventDates[ new Date( '09/03/2015' )] = 'unavailable';
    eventDates[ new Date( '09/04/2015' )] = 'unavailable';
    eventDates[ new Date( '09/05/2015' )] = 'unavailable';
    eventDates[ new Date( '09/06/2015' )] = 'unavailable';
    eventDates[ new Date( '09/07/2015' )] = 'unavailable';
    eventDates[ new Date( '09/08/2015' )] = 'unavailable';
    eventDates[ new Date( '09/09/2015' )] = 'unavailable';
    eventDates[ new Date( '09/10/2015' )] = 'unavailable';
    eventDates[ new Date( '09/11/2015' )] = 'unavailable';
    eventDates[ new Date( '09/12/2015' )] = 'unavailable';
    eventDates[ new Date( '09/13/2015' )] = 'unavailable';
    eventDates[ new Date( '09/14/2015' )] = 'unavailable';
    eventDates[ new Date( '09/15/2015' )] = 'unavailable';
    eventDates[ new Date( '09/16/2015' )] = 'unavailable';
    eventDates[ new Date( '09/17/2015' )] = 'unavailable';
    eventDates[ new Date( '09/18/2015' )] = 'unavailable';
    eventDates[ new Date( '09/19/2015' )] = 'unavailable';
    eventDates[ new Date( '09/20/2015' )] = 'unavailable';
    eventDates[ new Date( '09/21/2015' )] = 'unavailable';
    eventDates[ new Date( '09/22/2015' )] = 'unavailable';
    eventDates[ new Date( '09/23/2015' )] = 'unavailable';
    eventDates[ new Date( '09/24/2015' )] = 'unavailable';
    eventDates[ new Date( '09/25/2015' )] = 'unavailable';
    eventDates[ new Date( '09/26/2015' )] = 'unavailable';
    eventDates[ new Date( '09/27/2015' )] = 'unavailable';
    eventDates[ new Date( '09/28/2015' )] = 'unavailable';
    eventDates[ new Date( '09/29/2015' )] = 'unavailable';
    eventDates[ new Date( '09/30/2015' )] = 'unavailable';

    $( ".section-booking .date-picker-inline1" ).datepicker({
         beforeShowDay: function(date) {               
         var highlight = eventDates[date];
          if (highlight) {
                return [true, 'css-class-to-highlight ' + highlight, ''];
            } else {
                // default
                return [true, '', ''];
           }
       }

1 个答案:

答案 0 :(得分:0)

为什么不创建这样的高亮显示功能:

function highlight(start, end){
     var currentDay = start;
     while(currentDay <= end){
         eventDates[currentDay] 'unavailable';
         currentDay.setDate(currentDay.getDate() + 1);
     }
 }

然后使用您想要突出显示的日期调用该函数:

highlight(new Date('09/01/2015'), new Date('09/30/2015'));