Fullcalendar clientEvents的长度为零
在根据URL中的信息加载页面和日历后,试图突出显示特定事件时,我了解到我已经获得了要使用的事件对象。我还了解到,使用是你应该做的事情。当我尝试使用Fullcalendar clientEvents的长度为零,fullcalendar,Fullcalendar,在根据URL中的信息加载页面和日历后,试图突出显示特定事件时,我了解到我已经获得了要使用的事件对象。我还了解到,使用是你应该做的事情。当我尝试使用clientEvents时,我只是得到了一个空数组。文档和似乎同意,如果我不提供可选参数,那么我应该返回当前日历上所有内容的数组 <script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js'><
clientEvents
时,我只是得到了一个空数组。文档和似乎同意,如果我不提供可选参数,那么我应该返回当前日历上所有内容的数组
<script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js'></script>
<script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.min.js'></script>
<script type='text/javascript'>
$(document).ready(function() {
$('#calendar').fullCalendar({
defaultView: 'agendaWeek',
header: {
left: 'prev,next today',
center: 'title',
right: 'month,agendaWeek,agendaDay',
},
});
$('#calendar').fullCalendar('addEventSource',
{ url: 'https://www.example.org/combinedcalendar/feed/json.php',
dataType: 'jsonp'});
console.log($('#calendar').fullCalendar('clientEvents').length);
});
</script>
<div id='calendar'></div>
$(文档).ready(函数(){
$(“#日历”).fullCalendar({
defaultView:'agendaWeek',
标题:{
左:“上一个,下一个今天”,
中心:'标题',
右图:“月,agendaWeek,agendaDay”,
},
});
$(“#日历”).fullCalendar('addEventSource',
{url:'https://www.example.org/combinedcalendar/feed/json.php',
数据类型:'jsonp'});
console.log($('#calendar').fullCalendar('clientEvents').length);
});
javascript控制台中记录的值为
0
当我撰写这个问题并进行测试时,我意识到什么应该是显而易见的。$('#calendar').fullCalendar('addEventSource',…)使用ajax的代码>调用是异步的。因此,在事件数据实际下载并添加到日历之前,clientEvents
到控制台的日志记录发生了
我将日志移到fullCalendar函数中,该函数在加载开始或完成时触发
$('#calendar').fullCalendar({
loading:function(isLoading,view){
if (!isLoading)
{
console.log($('#calendar').fullCalendar('clientEvents').length);
}
},
...
});
我尝试了Zoredache的代码片段,但发现它并没有涵盖加载仍在进行的情况。
在这种情况下,最好使用函数检查加载是否已完成:
function onCalLoad(el, isLoading, view){
if (isLoading){
setTimeout(onCalLoad, 300);
} else {
if (el.fullCalendar('clientEvents').length==0){
some ops..
};
}
}
$('#calendar').fullCalendar({
loading:function(isLoading,view){
onCalLoad($(this), isLoading, view);
},
...
});