Question

之前我曾问过这个问题 - 但我意识到我没有很好地描述这个问题。

全日历活动正在显示为一个跨越所包含日期的蓝色条形图。

每个事件都是这样的：

<td class="fc-event-container" colspan="4"> 
    <a class="fc-day-grid-event fc-
      event fc-start fc-end foo fc-draggable fc-resizable" 
        style="background-
   color:red;border-color:red"><div class="fc-content"> 
   <span class="fc-title">hello</span></div><div class="fc-resizer"></div>
   </a>
</td>

假设我有一个超过4天的事件 - 实际上没有4个内容 - 但是一个td跨越4个tds（colspan =＆＃34; 4＆＃34;）。

我需要为每个包含的活动日添加图标，因此它会如下所示：

但我不能因为没有添加内容的标识....谢谢

这是我的Fiddle

Answer 1

得到它...... plunker

需要使用日期循环tds，然后添加图标。

            eventAfterRender: function (event, element) {

                    $.each($('td .fc-day-number'), function(){

                        var zone_date =$(this).attr('data-date');

                        var event_start_date = event.start._i;
                        var event_end_date = event.end._i;

                        if( event_start_date == zone_date){


                        }

                        var fDate = new Date(event.start._i);
                        var lDate = new Date(event.end._i);
                        var cDate = new Date(zone_date);

                        if((cDate <= lDate && cDate >= fDate)) {
                          var foo = $('td .fc-event-container a');
                          $.each(foo,function(){

                            if($(this).hasClass('test') ){
                              $(this).remove();

                            };


                          });



                            var zone_class = event.className.toString();

                            $(this).addClass(zone_class);
                            $(this).css('background-color','red');
                            var current_num = $(this).text();
                            $(this).html(current_num + "<i class='fa fa-
                     circle'></i>");
                        }

                    });

                }

Answer 2

这个解决方案怎么样：Fiddle？我知道它不一样，但它具有eventRender功能的解决方案。您可以更新我的版本，其中图标乘以事件持续时间。

如何更改全日历活动的显示？

2 个答案: