FullCalendarJS：更改选择事件颜色

Question

我正在使用FullcalendarJS，当我在一周视图中选择日期/时间时，我想要更深的颜色

从上图中可以看出，当我选择一个日期范围时，突出显示不是那么明显我希望它像今天突出显示的蓝色一样可见。

我尝试更改select事件属性上的css但它只在选择后更改。

这是我的代码：

 $('.calendar').fullCalendar({
  header : {
        left:   'prev,next today',
        center: 'title',
        right:  'agendaWeek,agendaDay'
    },
    timezone: 'local',
    defaultView : 'agendaWeek',
    allDaySlot : false,
    eventOverlap: false,
        select: function(start, end, event, view, resource) {
        $(".fc-highlight").css("background", "#00004c");
    }
 })

Answer 1

不要在fc-highlight事件期间更改CSS select类的颜色，只需在CSS中声明以下内容即可覆盖它：

.fc-highlight {
   background-color: #00004c;
}

另外，请务必在selectable: true配置中设置fullCalendar。因为默认为false - 根据API文档 - ，如果要通过单击或拖动进行选择，则必须为true（我从此指出了这一点）我在提供的代码段中看不到它。

示例：

$('.calendar').fullCalendar({
   header: {
     left: 'prev,next today',
     center: 'title',
     right: 'agendaWeek,agendaDay'
   },
   timezone: 'local',
   defaultView: 'agendaWeek',
   allDaySlot: false,
   eventOverlap: false,
   selectable: true
});

如您所见，除非您想在此时执行任何操作，否则不再需要select事件功能。

现场演示： http://jsfiddle.net/4nb4gpnL/