在我的fullcalendar ajax 数据中，有一个名为backgroundc 的字段，它表示事件的背景颜色更改为红色。这在默认的月份 View 中完美运行，但在 listDay 或 listWeek View 中不起作用，甚至在检查代码时认为 tr 类 fc-list-item 确实将这些事件的背景颜色属性显示为红色。我还运行了一个 qtip 事件，该事件适用于所有 View 。我正在运行 fullcalendar 3.0.1 这是我的日历代码。
<script type="text/javascript">
$(function(){
$("#divcalander").fullCalendar({
aspectRatio: 1.6,
header:{
left: 'prev,next today',
center: 'title',
right: 'month,listWeek,listDay,listMonth'
},
views:{
month:{
titleFormat: '[MCH In-Sevices for ]'+'MMMM YYYY'
},
listWeek:{buttonText: 'List Week'},
listDay:{buttonText: 'List Day'},
month:{buttonText: 'Month'},
listMonth:{buttonText: 'List Month'}
},
theme: true,
events:{
url:'populateinservicecal.php',
type:"get",
dataType:"json",
data:{startParam:'startDate',endParam:'endDate'}
},
eventRender:function(event,element){
element.qtip({
content:
{text:"Location: "+event.locationdescr,
title:event.title},
position: {
my: 'bottom left',
style:{
classes: 'qtip-cream'
}
}
})
if(event.backgroundc=="Red"){
element.css('background-color','Red')
}
},
eventLimit: false,
timeFormat: 'h:mmt'
})
})
</script>
<title>HRS Class Sessions</title>
</head>
<body>
<div style=" margin: auto; width: 900px;">
<div style="height: 20px;"></div>
<div id="divcalander"></div>
</br>
<div id="statementdiv">
<h2 id="redstatement">Any event with a red background is a mandatory annual inservice.</h2>
</div>
</div>
这是对运行良好的月份事件的检查。
<td class="fc-event-container">
<a class="fc-day-grid-event fc-h-event fc-event fc-start fc-end" data-hasqtip="40" aria-describedby="qtip-40" style="background-color: rgb(255, 0, 0);">
<div class="fc-content">
<span class="fc-time">10:30a</span>
<span class="fc-title">The Class</span>
</div>
</a>
现在这是对同一事件的 listDay View 的检查
<tr class="fc-list-item" data-hasqtip="68" aria-describedby="qtip-68" style="background-color: rgb(255, 0, 0);">
<td class="fc-list-item-time ui-widget-content">10:30a</td>
<td class="fc-list-item-marker ui-widget-content">
<span class="fc-event-dot"></span>
</td>
<td class="fc-list-item-title ui-widget-content">
<a>The Class</a>
</td>
正如您所看到的，月份事件上的 a 标签的背景颜色为红色，显示在日历上，但在 listDay View 上，tr 的背景颜色未显示。我尝试了几种不同的方法，但均无济于事。
最佳答案
你能检查一下你的代码是否与这个 fiddle 不同吗？
$(document).ready(function() {
$('#calendar').fullCalendar({
aspectRatio: 1.6,
theme: true,
eventLimit: false,
timeFormat: 'h:mmt',
header:{
left: 'prev,next today',
center: 'title',
right: 'month,listWeek,listDay,listMonth'
},
views:{
month:{
titleFormat: '[MCH In-Sevices for ]'+'MMMM YYYY'
},
listWeek:{buttonText: 'List Week'},
listDay:{buttonText: 'List Day'},
month:{buttonText: 'Month'},
listMonth:{buttonText: 'List Month'}
},
defaultView: 'month',
events: [
{
title: 'Meeting',
start: '2016-12-01T10:30:00',
end: '2016-12-01T12:30:00',
backgroundc: 'red'
},
{
title: 'Meeting 2',
start: '2016-12-01T12:30:00',
end: '2016-12-01T14:30:00',
backgroundc: 'green'
}
],
eventRender:function(event,element){
if (event.backgroundc == 'red') {
element.css('background-color', '#ff0000');
}
},
});
});
关于javascript - 我的全日历背景颜色在 listDay 或 listWeek 上不起作用，但在 Month 上起作用，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/40914609/