Question

我使用Adam Shaw的jQueryUI FullCalendar（http://arshaw.com/fullcalendar/docs/event_data/events_function/）。

当我按下一个按钮时，日历会从我的服务器加载新事件，我想将这些事件也显示在我的页面上，而不仅仅是在日历中。一旦FullCalendar获取了回调函数，我可以注入以执行某些事件吗？或者有没有其他方法来获取当前显示的事件？

Answer 1

对于其他寻求此解决方案的人来说，它在V2中非常简单。您可以使用简单事件对象传递成功回调。

        $('#calendar').fullCalendar({
            events: {
                url: 'http://yourdatafeed',
                type: 'POST',
                error: function() {
                    // Alert on error
                },
                success: function (data) {
                    // data will have your json array of event objects
                },
            }
        });

Answer 2

您发布的链接显示了您问题的答案：

$('#calendar').fullCalendar({
events: function(start, end, callback) {
    $.ajax({
...

每次获取新事件时都会使用“events”回调函数。在示例中，调用jQuery的$.ajax函数来检索事件数据（查看the ajax function）。然后$.ajax的“成功”回调会将服务器中的事件数据解析为FullCalendar所期望的格式：

$(doc).find('event').each(function() {
     events.push({
         title: $(this).attr('title'),
         start: $(this).attr('start') // will be parsed
     });
 });
callback(events);

在示例中，'doc'是一个xml文档，其中包含带有title和start属性的事件元素。您应该将此更改为从服务器检索的任何内容。检索到数据后，您可以在将其传递给FullCalendar之前或之后执行任何操作（如示例中所示callback(events);）

Answer 3

我通过实际重写代码来获取数据来解决问题：

var myCustomFunction = function(events) {
    // do something
}

var myCustomFetchFunction = function(start, end, callback) {
    $.ajax({
        url: 'feed.php',
        dataType: 'json',
        data: {
            // our hypothetical feed requires UNIX timestamps
            start: Math.round(start.getTime() / 1000),
            end: Math.round(end.getTime() / 1000)
            // additional parameters can be added here
        },
        success: function(events) {
            callback(events);
            // this is where I do some custom stuff with the events
            myCustomFunction(events);
        }
    });
};

$('#calendar').fullCalendar({
     events: myCustomFetchFunction()
});

Answer 4

使用eventRender在DOM中插入事件。见documentation

eventRender: function(event, element) {
    // do some DOM manipulation here
}

或收集它们以便稍后将它们插入DOM中：

var collection = [];
$('#calendar').fullCalendar({
    eventRender: function(event, element) {
        collection.push(event);
    }
});

jQueryUI FullCalendar：从服务器获取事件后的回调

4 个答案: