Question

以下代码是我在博客中找到的用于更改事件单元格背景颜色的代码。但事件渲染正在改变所有事件的单元格颜色。

event Render : function (event, element) {
    var dataToFind = moment(event.start).format('YYYY-MM-DD');
    $(" td [data-date='"+dataToFind+"']").addClass('activeDay');
}

我的问题是我有两个不同的事件，我想只为一个事件更改单元格背景颜色，其他事件应该是正常的。

Answer 1

您可以通过两种方式实现上述目标

使用eventAfterAllRender回调代替eventRender并使用您需要的条件，例如您要将课程添加到当天
```
var dataToFind = moment().format('YYYY-MM-DD');
$(" td [data-date='"+dataToFind+"']").addClass('activeDay');
```
使用eventRender回调，在函数中写下以下代码段。

如果您想在今天添加“activeDay”课程，那么

eventRender: function(event, element) {
   var today = moment().format('YYYY-MM-DD');
   var dataToFind = moment(event.start).format('YYYY-MM-DD');

   if (today == dataToFind) {
      $(element).addClass('activeDay');
   }
}

希望这能帮到你！

Answer 2

感谢您的回答，但以下自己的代码在我的方案中帮助了我，

if (event.title.match("^XXXX:")) {
                        var start = new Date(event.start);
                        var end = new Date(event.end);
                        var dateDiff = end.getDate() - start.getDate();
                        if (moment(event.start).format('YYYY-MM-DD') != moment(event.end).format('YYYY-MM-DD')) {
                            for (i = 0; i < dateDiff + 1; i++) {

                                $("td[data-date='" + moment(start).add('days', i).format('YYYY-MM-DD') + "']").addClass('activeDay')
                            }
                        }
                        else if (moment(event.start).format('YYYY-MM-DD') == moment(event.end).format('YYYY-MM-DD')) {
                            $("td[data-date='" + moment(event.start).format('YYYY-MM-DD') + "']").addClass('activeDay');
                        }
                    }

fullcalendar不同的事件细胞背景颜色

2 个答案: