javascript - jQuery UI Datepicker beforeShowDay 函数未运行

Question

我使用 jQuery 的日期选择器作为日历，并尝试使用“beforeShowDay”函数突出显示日历中的某个日期，但该函数甚至没有被触发。

JavaScript

        jQuery(document).ready(function() {
            // An array of dates
            var eventDates = [new Date(2016, 9, 7),new Date(2016, 9, 8)];
            console.log(('#calendar'.beforeShowDay));
            console.log(eventDates);
            // datepicker
            $('#calendar').datepicker({
                dateFormat: 'yy-mm-dd',
                beforeShowDay: function(date) {
                    var highlight = eventDates[date];
                    console.log(highlight);
                    if(highlight) {
                        return [true, "calendarHighlight", ''];
                    } else {
                        return [true, '', ''];
                    }
                }
            });
        });

CSS

.calendarHighlight {
            background-color: red; !important;
        }

HTML

<div id="calendar"></div>

Answer 1

您的问题是您将值存储在数组中，但尝试像对象一样访问它

数组

var eventDates = [new Date(2016, 9, 7),new Date(2016, 9, 8)];

这行不通

var highlight = eventDates[date];

您还应该使用 .getTime() 比较日期

也这样

var eventDates = [new Date(2016, 9, 7).getTime(),new Date(2016, 9, 8).getTime()];

然后使用 jQuery.inArray 检查它是否在数组中

var highlight = $.inArray(date.getTime(),eventDates) >= 0;

FIDDLE