我想通过 jquery fullcalendar 的 json 事件源传递事件的颜色,如何实现这一点?
最佳答案
没有比这更容易的了。如果您查看 jQuery Fullcalendar Event Colors 的文档您会看到可以为每个事件对象指定一个参数className
。该参数的内容会作为类添加到事件中,因此您只需指定具有匹配名称的 css。
事件(记下 event1 上的 className
参数)
[
{
title : 'event1',
start : '2012-06-10',
className : 'custom',
},
{
title : 'event2',
start : '2012-06-05',
end : '2012-06-07'
},
{
title : 'event3',
start : '2012-06-09 12:30:00',
allDay : false
}
]
使 event1
看起来不同的 CSS
.custom,
.custom div,
.custom span {
background-color: green; /* background color */
border-color: green; /* border color */
color: yellow; /* text color */
}
查看此处http://jsbin.com/ijasa3/96以获得快速样本。请注意 event1 如何将绿色作为背景,将黄色作为文本颜色。
<小时/>使用 jQuery Fullcalendar Event Colors 中描述的选项的另一种可行方法可以沿着这些思路:
对需要其他颜色的事件使用不同的事件源:
$('#calendar').fullCalendar({
...
eventSources: [
//a full blown EventSource-Object with custom coloring
{
events: [
{
title : 'event1',
start : '2012-06-10'
}
],
backgroundColor: 'green',
borderColor: 'green',
textColor: 'yellow'
},
//a normal events-array with the default colors used
[
{
title : 'event2',
start : '2012-06-05',
end : '2012-06-07'
},
{
title : 'event3',
start : '2012-06-09 12:30:00',
allDay : false
}
]
],
...
});
关于Jquery 完整日历和动态事件颜色,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/2441695/