简体   繁体   English

FullCalendar:如何识别元素的日历行?

[英]FullCalendar: How to identify the calendar row of the element?

On eventRender of the fullcalendar, I want to identify the element belongs to which row of the calendar. 在全日历的eventRender上,我想确定元素属于日历的哪一行。

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

What happens if the event is wrapped over two columns? 如果事件被包裹在两列上会发生什么? (ie because it is 10 days long) (即,因为它是10天长)

I'm looking at the source for FullCalendar, and I don't think you're going to find what you want - the element is an absolutely positioned div, and eventRender is called for each "segment" of the event , so if it wraps, you end up with two eventRender calls. 我正在查看FullCalendar的源代码,我认为你不会找到你想要的东西 - element是一个绝对定位的div,并且为event每个“段”调用eventRender,所以如果它换行,你最终得到两个eventRender调用。

Anyways, if those "gotchas" don't dissuade you, here's a crack at figuring it out. 无论如何,如果那些“陷阱”不劝阻您,那么这很容易被发现。 I used the row widths/heights vs the element top to figure it out, I don't really see a more elegant way. 我用行的宽度/高度与元素的顶部之间的距离来弄清楚,我真的没有看到一种更优雅的方法。 Note you'll want to change the .fc-view-month bit to a selector that starts from your actual calendar ID. 请注意,您需要将.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);
}

That will alert you with the "row" as defined by the calendar, ie the first row is actually "0" 这将提醒您日历定义的“行”,即第一行实际为“0”

EDIT : just realized that eventRender is called before the element is placed on the calendar, so my idea pretty much won't work. 编辑 :刚才意识到在将元素放在日历上之前调用了eventRender,所以我的想法几乎不起作用。 I've changed it to eventAfterRender . 我把它改成了eventAfterRender I think if it was important enough to you, the thing to do would be to modify FullCalendar so that whenever it sends you the "element" in the eventRender function, it also sends you the placement info (which it has in a structure called segs in the calling function). 我认为如果它对你来说非常重要,那么要做的就是修改FullCalendar,这样每当它向eventRender函数发送“元素”时,它也会向你发送放置信息(它在一个名为segs的结构中)在调用函数中)。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM