FullCalendar 根据视图更改事件颜色答案

【问题标题】：FullCalendar changing event color based on viewFullCalendar 根据视图更改事件颜色
【发布时间】：2015-07-22 23:14:48
【问题描述】：

我正在尝试根据在完整日历中呈现的视图动态更改我的事件颜色。

当我使用 ajax 将事件填充到日历中时，我会从服务器动态传递颜色和 textColor。

        if event.service_area:
        if event.service_area.pk == 1:
            color = '#4986e7'
        elif event.service_area.pk == 2:
            color = '#ff7537'
        elif event.service_area.pk == 3:
            color = '#f691b2'
    else:
        color = '#00a19c'

    start = event.start_datetime.strftime("%Y-%m-%d %H:%M:%S")

    event_slug = {
        'title': event.summary,
        'start': start,
        'description': event.description,
        'location': event.location,
        'g_event_id': event.google_event_id,
        'status': event.status,
        'event_id': event.id,
        'color': '#fff',
        'textColor': color,
    }

在“月”视图中，我想保留最初在事件 json 中传递的颜色（彩色文本，白色背景），但是当我切换到“basicWeek”或“agendaDay”视图时，我希望颜色切换（白色文本，彩色背景）。当我第一次切换视图时它可以工作，但是随后的任何视图切换都会导致颜色无休止地切换。

eventRender: function(event, element, view) {
    if (view !== 'month' ) {
      var color = event.color;
      var text = event.textColor;

      event.color = text;
      event.textColor = color;
    }
}

如何设置此事件渲染脚本，仅在我要从“月”更改为“议程日”或“基本周”的视图时切换我最初传递的颜色，然后在切换回来时恢复为原始颜色到“月”视图？

【问题讨论】：

添加一个类到元素...并使用基于视图类的css规则

标签： javascript jquery colors fullcalendar

【解决方案1】：

您在错误的对象上使用了颜色。

来自documentation：

event 是尝试呈现的事件对象。

element 是一个新创建的用于渲染的 jQuery 元素。它已经填充了正确的时间/标题文本。

所以，将颜色应用到 element 变量，而不是 event。这样，您的原始颜色不会在实际 event 对象中发生变化，只会在呈现的对象中发生变化。

【讨论】：