javascript - FullCalendar:如何识别元素的日历行？

Question

在fullcalendar的eventRender上，我想识别该元素属于日历的哪一行。

eventRender: function(event, element) {
    //find calendar row of the element
}

Answer 1

如果事件包含在两列中会发生什么？ (即因为它有 10 天长)

我正在查看 FullCalendar 的源代码，我认为您不会找到您想要的内容 - element 是一个绝对定位的 div，并且为 event 的每个“段”调用 eventRender ，因此，如果它换行，您最终会调用两次 eventRender。

无论如何，如果这些“陷阱”没有阻止你，这里有一个解决办法。我使用行宽度/高度与元素顶部来计算出来，我真的没有看到更优雅的方法。请注意，您需要将 .fc-view-month 位更改为从实际日历 ID 开始的选择器。

eventAfterRender: function(event,element){
    var level = undefined;
    var elTop = $(element).position().top;
    $('.fc-view-month tr[class^="fc-week"]').each(function(){
       var rowTop = $(this).position().top;
       var height = $(this).height();
       if (elTop >= rowTop && elTop < rowTop + height){
           level = $(this).attr('class').replace('fc-week','');
           return false;
       }
    });
    alert(level);
}

这将提醒您日历定义的“行”，即第一行实际上是“0”

编辑:刚刚意识到 eventRender 在元素放置在日历上之前被调用，所以我的想法几乎行不通。我已将其更改为 eventAfterRender 。我认为如果这对你来说足够重要，那么要做的就是修改 FullCalendar，以便每当它向你发送 eventRender 函数中的“元素”时，它也会向你发送放置信息(它在一个名为 segs 的结构中)在调用函数中)。