如何突出显示在FullCalendar.js中有事件的日期？ [英] How to highlight a day which has an event in FullCalendar.js?

问题描述

我在我的网站使用FullCalendar.js。我从后端设置事件。我想改变有一个事件的那天的外观。换句话说，我需要某种类，我有fc-day和一个事件。

I am using FullCalendar.js in my website. I have set events from backend. I want to change look of the day which has an event. In other words I need some sort of class where I have "fc-day" and an event in it.

我的代码看起来像，你看到它在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'
    }]
})

推荐答案

我想出了一种混乱的解决方案：通过data-attributes添加一个类： / strong>

I came up with a kind of a messy solution: adding a class by data-attributes:

function addClassByDate(date) {
    var dataAttr = getDataAttr(date);
    $("[data-date='" + dataAttr + "']").addClass("hasEvent");
}

function getDataAttr(date) {
    return date.getFullYear() + "-" + (date.getMonth() + 1) + "-" + (date.getDate().toString().length === 2 ? date.getDate() : "0" + date.getDate());
};

它在您的问题中提供的设置正常。

It works fine for the settings, you've provided in your question.

工作示例可以在这里找到： http://jsfiddle.net/6NShN / 9 /

The working example could be found here: http://jsfiddle.net/6NShN/9/

这篇关于如何突出显示在FullCalendar.js中有事件的日期？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！