javascript - 如何在 FullCalendar.js 中突出显示有事件的一天？

Question

我在我的网站中使用 FullCalendar.js。我已经从后端设置了事件。我想更改有事件当天的外观。换句话说，我需要某种类型的类(class)，其中我有“fc-day”和其中的一个事件。

My code looks like and you see it on jsFiddle:

$('#calendar').fullCalendar({
    events: [{
        title: 'event1',
        start: '2013-01-01'
    }, {
        title: 'event2',
        start: '2013-12-05',
        end: '2013-12-07'
    }, {
        title: 'event3',
        start: '2013-12-15'
    }]
})

Answer 1

您可以使用 eventRender() Full Canendar 的属性。

这适用于 fullcalendar v2:

$('#calendar').fullCalendar({
         events: [
        {
            title  : 'event1',
            start  : '2014-04-01'
        },
        {
            title  : 'event2',
            start  : '2014-04-05',
        },
        {
            title  : 'event3',
            start  : '2014-04-15'
        }
    ],
    eventRender: function (event, element, view) { 
        // like that
        var dateString = moment(event.start).format('YYYY-MM-DD');
        $('#calendar').find('.fc-day-number[data-date="' + dateString + '"]').css('background-color', '#FAA732');
     }

});

Note: You will need Moment library for this.