获取完整日历事件的 html 元素

Question

我有一个Fullcalendar事件的列表，我需要获得与它们相关联的实际HTML元素，这段代码检索一个事件对象数组：

var events = handleCalendarEvent('clientEvents', function(_event) {
                 return _event.origin === event.origin &&  isExternalEvent(_event);
             });

现在，我需要实际的HTML元素在悬停时对它们进行一些操作（eventrender不起作用），在查看文档时，我找不到任何函数来获取它们。

Answer 1

您可能仍然需要使用eventRender。据我所知，fullCalendar中没有内置getElementById类型的函数，而且，正如您可能知道的，没有向实际元素添加唯一可识别的属性。我会在回调期间添加一个id：

$('#calendar').fullCalendar({
  ...
  eventRender: function (event, element) {
    element.data('event-id',event.id);
  },
  ...
})

稍后，当您获取事件对象数组时，可以使用jQuery来查找它们：

var events = handleCalendarEvent('clientEvents', function(_event) {
                 return _event.origin === event.origin &&  isExternalEvent(_event);
             });
var first_event = $("#calendar").find('[data-event-id=' + events[0].id + ']');

Answer 2

如果你的事件有一个id集，你可以用eventRender添加一个id或数据标签，并将event.id设置到那里，然后eventMouseover你可以根据event.id 找到元素

eventRender: function (event, element, view) {
    /* The anchor tag is where the id gets set */
    element.attr('id', 'event-id-' + event.id);
},
eventMouseover: function (event, jsEvent, view) {
    var $html = $('#event-id-' + event.id).html();
}