Fullcalendar 如何设置单个单元格的背景颜色而不是事件的背景颜色?

Fullcalendar 如何设置单个单元格的背景颜色而不是事件的背景颜色?,fullcalendar,Fullcalendar,我不希望为圣诞节和复活节之类的活动创建事件,而是希望能够为受影响的日期单元格着色,甚至可能为每个事件创建一个灰色半透明文本。在FullCalendar中有什么简单的方法可以做到这一点吗 编辑 有人向我指出,fc state HIGHTING今天用于突出显示fc,因此,也许可以做类似的事情,将css类应用于单元格,并将其定义为“公共假日颜色”。一个想法。问题是如何将此类应用于相关日期,以便在FC内工作而不破坏任何内容。当doc就绪时,使用js函数选择所有TDs,并将数据日期添加到所需的TDs中,然

我不希望为圣诞节和复活节之类的活动创建事件,而是希望能够为受影响的日期单元格着色,甚至可能为每个事件创建一个灰色半透明文本。在FullCalendar中有什么简单的方法可以做到这一点吗

编辑


有人向我指出,fc state HIGHTING今天用于突出显示fc,因此,也许可以做类似的事情,将css类应用于单元格,并将其定义为“公共假日颜色”。一个想法。问题是如何将此类应用于相关日期,以便在FC内工作而不破坏任何内容。

当doc就绪时,使用js函数选择所有TDs,并将数据日期添加到所需的TDs中,然后将CSS类添加到这些TDs中。我不知道它是否有效,只是一个想法。

这可以使用。单独调用ajax查找所有假日,然后更改td的颜色。使用FC 2.0.1完成的六月一日的月份和假日示例:

eventAfterAllRender:函数(视图){
//使用view.intervalStart和view.intervalEnd查找假日的日期范围
//进行ajax调用以查找范围内的假期。
var fourthOfJuly=时刻('2014-07-04','YYYY-MM-DD');
var假日=[7月4日];
假期时刻;
对于(var i=0;i-1){
$(“td.+classNamesArray[i]).addClass('holiday');
打破
}
}
}
}else if(view.name==“agendaDay”){
if(holidayMoment.format('YYYY-MM-DD')=$('#calendar').fullCalendar('getDate').format('YYYY-MM-DD')){
$(“td.fc-col0”).addClass(“假日”);
};
}
}
}

是的,这也是我的想法所在。有点乱。看起来,至少在过渡期间,必须为公共假日等创建不可修改的事件。您使用的是什么版本的fce?您希望在什么视图中执行此操作?版本:FC 2.0.1。视图:月、代理日期、代理周。
       eventAfterAllRender: function (view) {
            //Use view.intervalStart and view.intervalEnd to find date range of holidays
            //Make ajax call to find holidays in range.
            var fourthOfJuly = moment('2014-07-04','YYYY-MM-DD');
            var holidays = [fourthOfJuly];
            var holidayMoment;
            for(var i = 0; i < holidays.length; i++) {              
                holidayMoment = holidays[i];
                if (view.name == 'month') {
                    $("td[data-date=" + holidayMoment.format('YYYY-MM-DD') + "]").addClass('holiday');
                } else if (view.name =='agendaWeek') {
                    var classNames = $("th:contains(' " + holidayMoment.format('M/D') + "')").attr("class");
                    if (classNames != null) {
                        var classNamesArray = classNames.split(" ");
                        for(var i = 0; i < classNamesArray.length; i++) {
                            if(classNamesArray[i].indexOf('fc-col') > -1) {
                                $("td." + classNamesArray[i]).addClass('holiday');
                                break;
                            }
                        }
                    }
                } else if (view.name == 'agendaDay') {
                    if(holidayMoment.format('YYYY-MM-DD') == $('#calendar').fullCalendar('getDate').format('YYYY-MM-DD')) {
                        $("td.fc-col0").addClass('holiday');
                    };
                }
            }
        }