设置Fullcalendar单元格背景颜色

veg*_*033 10 css jquery events background-color fullcalendar

我看到了几个关于如何在fullcalendar中设置单元格背景颜色的主题,但它们都不适用于我.我想日历用于列出使用日期的天数.fc-day5或.fc-day17,但在版本1.6.2中它不再存在.

我有一个正在呈现的几个事件的列表,我想将它们的单元格颜色(整个日期单元格,而不仅仅是事件单元格)设置为特定颜色.

我使用'eventRender'来尝试设置一个类

eventRender: function (event, element, monthView) { 
                if (event.className == "holiday") {
                    $day = $date.getDate();
                    $("td.fc-day-number[value='" + $day + "']").addClass("holiday");
                }
            },
Run Code Online (Sandbox Code Playgroud)

如果您对如何设置背景颜色有任何想法,请告诉我.

jon*_*nes 14

您可以尝试设置事件背景颜色.像这样的东西:

event.backgroundColor = 'cccccc#';
Run Code Online (Sandbox Code Playgroud)

或者对于细胞背景:

$('.fc-day[data-date="' + date + '"]').css('background', color);
Run Code Online (Sandbox Code Playgroud)

date必须是相当于php Y-m-d日期格式的日期字符串.渲染日历时样式需要更改.


Meh*_*ral 10

好吧,你可以做到这一点.

{
  title: 'Some title',
  start: new Date(2014, 8, 24, 10, 30),
  allDay: false,
  editable: false,
  backgroundColor: '#SomeColor',
  borderColor: '#SomeColor'
},
{
  title: 'Some title2',
  start: new Date(2014, 8, 24, 10, 30),
  allDay: false,
  editable: false,
  backgroundColor: '#SomeColor2',
  borderColor: '#SomeColor2'
}
Run Code Online (Sandbox Code Playgroud)

另外,你可以像这样设置类名:

{
  title: 'Teste1',
  start: new Date(y, m, d, 10, 30),
  allDay: false,
  editable: false,
  className: ["red"]
},
{
  title: 'Teste1',
  start: new Date(y, m, d, 10, 30),
  allDay: false,
  editable: false,
  className: ["green", "secondClass"]
}
Run Code Online (Sandbox Code Playgroud)

然后描述那种风格

<style>

.red {
    background-color:red;
}

.green {
    background-color:green;
}
.green{
// do something
}
</style>
Run Code Online (Sandbox Code Playgroud)