я поместить определение HTML класса в стиле тега, а затем использовать его в beforeShowDay и неопределен

Question

У меня есть следующие:

$("<style>") 
    .prop("type", "text/css") 
    .html("\ 
#markDates {\ 
    color: #FF0000;\ 
}") 
    .appendTo("head"); 

, а затем я называю этот класс в:

$('#multidatepicker').multiDatesPicker({ 
     //onClose: function (value, date) { 
     // //debugger; 
     // date.dpDiv.find('.ui-state-default').css('background-color', 'rgb(153, 204, 153)') 
     //}, 
     numberOfMonths: [3, 4], 
     //addDisabledDates: HolidayList, 
     addDates: getHolidays(), 
     beforeShowDay: function (date) { 
     // console.log('dateIn?', $.inArray(date, HolidayList)); 
      if ($.inArray(date, HolidayList) !== -1) { 
       $("td").removeClass("ui-state-highlight"); 
       return [true, "markDates" , "This is a holiiday"]; 
      } 
      else { 
       return [true]; 
      } 
     } 
    }); 

и когда я запускаю его, а затем проверяю элемент подсвеченной даты, следующее:

<td class=" ui-state-highlight undefined " data-handler="selectDay" data-event="click" data-month="0" data-year="2016"><a class="ui-state-default" href="#">1</a></td> 

Почему markDa tes undefined? Я попытался:

removeClass("ui-state-highlight").addClass("markDates") 

с таким же результатом.

Answer 1

Это не определено, потому что оно наносит вам else заявление в пределах beforeShowDay. Этот метод должен принять второй индекс возвращаемого значения и использовать его как класс для элемента дня. изменение return [true]; на return [true, 'noMarkDates']; исправляет неопределенную проблему, но на самом деле не решает проблему, потому что мы хотим выделить определенные дни. Я думаю, что это проблема с HolidayList. beforeShowDay использует объект даты для переменной date. Вы пытаетесь увидеть, находится ли тот же самый объект даты в массиве дат. Существует (по крайней мере, на мой взгляд) высокая вероятность того, что это приведет к ошибочным данным из-за несогласованного форматирования или слишком большой информации в объектах даты (объект даты включает часы, минуты, секунды и миллисекунды, когда все, что вам нужно, это день, месяц и год). Вероятно, вы можете исправить это, сначала форматируя свою дату.

beforeShowDay: function (date) { 
    // first get a consistent format for your date 
    var d = jQuery.datepicker.formatDate('mm-dd-yy', date); 
    // then compare it against an array of similarly formatted date strings 
    if ($.inArray(d, ["01-23-2016","03-17-2016","03-16-2016"]) !== -1) { 
    return [true, "markDates" , "This is a holiiday"]; 
    } 
    else { 
    return [true, 'noMarkDates']; 
    } 
} 

Результатом является то, что правильные даты выделены: https://jsfiddle.net/jmarikle/1gr6237q/1/

Кроме того, обратите внимание, что я использовал стиль .markDates { background: red; }. Вместо этого вы используете идентификатор вместо класса (разница . и #). Вместо этого используйте класс.

formatDate Получил немного здесь: https://stackoverflow.com/a/28852510/854246