javascript - 在FullCalendar dayClick事件中，能否获取点击日期已经存在的事件？

Question

在FullCalendar dayClick事件中，能否获取点击日期已经存在的事件？

http://arshaw.com/fullcalendar/docs/mouse/dayClick/

让我解释一下我的项目我正在编写一个简单的 php 网站，允许用户在日历上添加/编辑事件。

• 只有单个事件可以添加到日期中。
• 如果用户点击空日期，将显示新事件弹出窗口(我使用 dayclick 事件)。
• 如果用户点击现有事件的日期，将显示编辑事件弹出窗口(我使用 eventclick 事件)。

问题是，当用户在具有现有事件的日期的事件区域(上部区域或底部区域)之外单击时，它会引发 dayclick 而不是 eventclick。如果日期中已有事件，如何触发 eventclick 事件并跳过 dayclick 事件？

Answer 1

您的事件是存储在客户端还是服务器端？如果在客户端，如果您希望在该点击时间发生事件，这应该特别有效:

$('#calendar').fullCalendar({
    dayClick: function(date, allDay, jsEvent, view) {
            $('#calendar').fullCalendar('clientEvents', function(event) {
                if(event.start <= date && event.end >= date) {
                    return true;
                }
                return false;
            });
    }
});

这将给出与点击时间重叠的事件并存储在客户端。对于全天时段，它将给出当天重叠的所有事件。

如果您想要该日期本身的所有事件，无论是否单击了 allDay 槽或时间槽。

$('#calendar').fullCalendar({
    dayClick: function(date, allDay, jsEvent, view) {
            if(!allDay) {
                // strip time information
                date = new Date(date.getFullYear(), date.getMonth(), date.getDay());
            }
            $('#calendar').fullCalendar('clientEvents', function(event) {
                if(event.start <= date && event.end >= date) {
                    return true;
                }
                return false;
            });
    }
});

如果您的事件存储在服务器上，您需要获取 dayClick 回调中提供的日期，并使用它构建对服务器的调用以获取所需格式的信息。

编辑如果进行往返或尝试以其他方式获取信息

$('#calendar').fullCalendar({
    dayClick: function(date, allDay, jsEvent, view) {
            var startDate = new Date(date.getFullYear(), date.getMonth(), date.getDay(), 0, 0, 0).getTime();
            var endDate = new Date(date.getFullYear(), date.getMonth(), date.getDay(), 23, 59, 59).getTime();
            var cache = new Date().getTime();
            $.getJSON("/json-events.php?start="+startDate+"&end="+endDate+"&_="+cache,
                function(data) {
                    // do stuff with the JSOn data
                }
    }
});

如果您不想要往返，您还可以查看 fullCalendar.js 中的 refetchEvents 中发生的情况。如果您不介意从 fullCalendar 主干中分离出来，您可以将获取的事件保存在某个地方，这样您就不会进行大量的 DOM 操作(取决于事件的数量，因为它们变大会变得笨拙)。