Fullcalendar:更改特定日期的颜色

Question

我遇到了一个我上班的项目.我需要改变一些天的背景颜色.这是一个用户应该看到的日历,哪些日期可用,哪些日期不可用.我发现有一个名为"data-date"的属性,但我没有找到使用它的可能性.

有没有办法操纵特定日子的背景？

我认为必须有一种方法,因为显示当前日期的单元格也有另一种颜色.

Answer 1

对于意见month,basicWeek并且basicDay你可以通过提供一个改变的日子渲染dayRender功能.例如:

$("#calendar").fullCalendar({
    dayRender: function (date, cell) {
        cell.css("background-color", "red");
    }
});

该文档dayRender可在此处获得:http://arshaw.com/fullcalendar/docs/display/dayRender/

这里有一个关于jsfiddle的工作示例:http://jsfiddle.net/kvakulo/CYnJY/4/

Answer 2

    dayRender: function(date, cell){
        if (moment().diff(date,'days') > 0){
            cell.css("background-color","silver");
        }
    },

Answer 3

对于那些只想改变过去日期颜色的人,请.fc-past在你的css中定位并添加一个background-color属性.例如,:

.fc-past {
    background-color: silver;
}

Answer 4

如果有人想要 jquery fullcalendar 前一整天为红色（或任何其他）颜色，那么这就是代码。

    var $calendar = $('#calendar').fullCalendar({
    header: {
        left: 'prev,next today',
        center: 'title',
        right: 'month,basicWeek,basicDay'
    },

    defaultView: 'month',

    dayRender: function (date, cell) {
       var check = $.fullCalendar.formatDate(date,'yyyy-MM-dd');
                    var today = $.fullCalendar.formatDate(new Date(),'yyyy-MM-dd');
                    if (check < today) {
                        cell.css("background-color", "red");
                    }
    }
});

Regin Larsen 代码帮助我实现了这一目标。谢谢雷金·拉森。