jQuery datepicker突出显示两个日期之间的eventDate

Question

Please can you help me to solve these below issues in jquery datepicker

I want to highlight the start date '09/01/2015' to end date '09/30/2015' without adding every single day, like:

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

This is what my code looks like:

    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, '', ''];
           }
       }

Answer 1

Why not just create a highlight function like this:

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

And then call the function with your dates that you want highlighted:

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