我有 fullCalendar，它显示可以由不同用户编辑的事件，并且日历使用此功能每 15 秒重新获取一次事件:
setInterval(function(){
$('#calendar').fullCalendar('refetchEvents');
}, 15* 1000);
但是当事件状态发生更改时，我看不到实时更新(颜色更改、弹出警报等)，但是当手动刷新页面或在事件开始后 30 分钟内创建事件时，一切正常。
eventRender 的完整代码在这里:
eventRender: function(event, element, view) {
if (view.name == 'agendaDay') {
$('.fc-event-title').css("display", "block");
}
var mili = event.start.getTime() - now.getTime();
var hour = now.getTime();
var eventhour= event.start.getTime();
if(event.status == 'open') {
if (eventhour< hour) {
element.css('background-color', '#999');
}
else{
element.css('background-color', '#70D549');
}
}
else if(event.status == 'done') {
element.css('background-color', '#B2F0FF');
}
else if(event.status == 'invalid') {
element.css('background-color', '#CC0000');
}
else if(event.status == 'booked') {
if(mili < 1800000 && mili > 0){
$(".name2").html(event.status);
$(".t2").html(event.btitle);
$(".n2").html(event.name);
$(".s2").html(event.surname);
$(".ad2").html(event.address);
$(".zp2").html(event.city);
$(".ct2").html(event.zip);
$(".tl2").html("Tel: "+event.tel);
$(".ml2").html(event.email);
$(".title2").html('<strong>Description:</strong><br/>'+event.title+'');
var hcs1 = event.start.getHours();
var hcs = ("0" + hcs1).slice(-2);
var mcs1 = event.start.getMinutes();
var mcs = ("0" + mcs1).slice(-2);
$(".start2").html(hcs + ':' +mcs);
var hce1 = event.end.getHours();
var hce = ("0" + hce1).slice(-2);
var mce1 = event.end.getMinutes();
var mce = ("0" + mce1).slice(-2);
$(".end2").html(hce + ':' + mce);
var dc1 = event.start.getDate();
var dc = ("0" + dc1).slice(-2);
var mc1 = event.start.getMonth()+1;
var mc = ("0" + mc1).slice(-2);
var yc = event.start.getFullYear();
$(".date").html(dc + '.' + mc + '.' + yc + '.');
element.css('background-color','#00CCFF');
if(!localStorage[event.id+"alertdisplayed"]) {
$('.alert').dialog({
buttons: [{
text: "OK",
click: function() {
$( this ).dialog( "close" );
}
}]
});
localStorage[event.id+"alertdisplayed"] = true
}
}
if (eventhour < hour) {
element.css('background-color', '#B2F0FF');
}
else{
element.css('background-color', '#00CCFF');
}
}
else if(event.status == 'storn') {
element.css('background-color', 'red');
}
}
最佳答案
更改时重新获取事件:
$("#someID").change(function () {
$('#yourCalendar').fullCalendar('refetchEvents');
});
不太好，但应该可以这样做:
$('#yourCalendar').fullCalendar( 'removeEventSource', source )
$('#yourCalendar').fullCalendar( 'addEventSource', source )
关于javascript - 使用 fullCalendar 实时刷新数据，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/24816052/