使用 eventRender 时 Fullcalendar 不呈现颜色

Question

当我设置 fullCalendar 并设置 eventRender 函数回调时，我想根据 LeadId 是否为空来设置事件的颜色。但这似乎不起作用，即使文档是这样说的:http://arshaw.com/fullcalendar/docs/event_data/Event_Object/#color-options

有没有办法根据数据设置事件颜色来改变？

 calendar = $('#dayview').fullCalendar({
            ....
            timeFormat: 'HH:mm',
            columnFormat: {
                agendaDay: 'dddd dd/MM/yyyy'
            },
            eventClick: function (calEvent, jsEvent, view) {
                var leadUrl = "/Leads/" + calEvent.LeadId;
                window.location = leadUrl;
            },
            eventRender: function (event, element) {
                if (event.LeadId != null) {
                    event.eventColor =  "#B22222";
                    event.eventBackColor = "#B22222";                       
                }
            },

更新:

这真的很奇怪。 事件 已为服务器关闭的事件返回了我的所有属性。
元素 只是事件的 DOM 元素。当我将事件拖动/移动到日历中的其他位置时，事件变为红色，如果我检查事件对象，它现在的颜色设置为红色。所以问题是为什么它不应用于第一次渲染，而是应用于后续渲染(即移动之后)颜色被应用？

Answer 1

编辑 2:对 fc-event-skin 类的一些新更改......现在只是 fc-event，所以样式应该不是问题。请在此处查看作者注释 fullcalendar fc-event class ...

编辑 1:也许不完全是错误。

最好的方法是在事件对象中设置 className 并将其添加到“fc-event-skin”类找到的元素中。但是，您添加的类将在 css 中稍后出现，并且颜色不会优先，因此您必须使用 !important。这也保留了“假”圆角......

将此方法连接到日历上...

eventRender:
function (event, element, view) {
    element.find('.fc-event-skin').addClass(event.className.join(' '));
}

这在您自己的样式表中...

.redGray
{
    border-color: DarkGray !important;
    background-color: LightGray !important;
    color: red !important;
}

原始答案:

我认为这是渲染代码中的一个小错误。 element 参数是一个 jQuery 对象，因此您可以根据自定义事件数据对其进行修改。如果你设置了元素的样式和文本，它将以你设置的颜色呈现；但是，在我看来，其他样式已从元素中删除，例如圆角以及时间和文本的格式。

eventRender: 
function (event, element) {
    if (event.LeadId != null) {
        element.css('color', 'blue');
        element.css('background-color', 'yellow');
        element.text(element.text);
    }