如何在完整日历中将+5更多文本更改为自定义文本

Question

我想在完整日历中将“更多文本”（+4更多）更改为自定义文本（例如“更多事件”）。请参考下面的图片。

示例：如果一天中有超过三个或两个事件的完整日历插件在特定日期添加了+ More事件，那么我想将文本更改为“ More Events”。

var fullcalendarId = $('.wellness');

var options = {
  header: {
    left: '',
    center: 'title',
    right: ''
  },
  columnHeaderFormat: 'dddd',
  navLinks: true, // can click day/week names to navigate views
  editable: true,
  eventLimit: true, // allow "more" link when too many events
  eventLimitText: function() {
      return "More Events"
  },
  disableDragging: true,
  eventMouseover: function( event, allDay, jsEvent, view) {
      var event_date = event.start._i;
      $('.fc-day-grid-event').css({ 'background':'#ffffff', }); 
      $( this ).css({ 'background':'#f7f7f7' });
      var offset = $( this ).offset();
      var eventHeight = $( this ).outerHeight();
      var fullcalendarId = 'fitness-wellness';
      var findValue = $(this).parents('.tab-pane.active').attr('id');
      if (window.matchMedia('(max-width: 991px)').matches){}
      else{
        eventContent(event.id, offset.left, offset.top, eventHeight, event_date, fullcalendarId);
      }  
  },
  eventMouseout: function( event, jsEvent, view ) { 

  },
  eventClick: function(calEvent, jsEvent, view) {
      var event_date = calEvent.start._i;
      var offset = $( this ).offset();
      var eventHeight = $( this ).outerHeight();
      var eventId = calEvent.id;
      var fullcalendarId = 'fitness-wellness';
      var findValue = $(this).parents('.tab-pane.active').attr('id');
      if (window.matchMedia('(max-width: 991px)').matches){}else{
        eventContent(calEvent.id, offset.left, offset.top, eventHeight, event_date, fullcalendarId);
      }
  },
  dayClick: function(date, jsEvent, view, resourceObj) {
      if (window.matchMedia('(max-width: 991px)').matches){
          $('.fc-past, .fc-future').css('background-color', 'transparent');
          $(this).css('background-color', '#d5d5d5');
          var eventDate = date.format();
          dayclickEventMobile(eventDate);
      }else{ }      
  },
  events: globalEventsFitness 
}

fullcalendarId.fullCalendar(options);   

Answer 1

moreLinkContent:function(args){
             let count_element = document.createElement('span');
             count_element.setAttribute('style', 'font-size: 16px;');
             count_element.innerHTML = 'More Events';
            return {
                domNodes:[count_element],
            }
         }

Answer 2

这里是 Fullcalendar v5+：

var calendarEl = document.getElementById('myDiv');
var calendar = new FullCalendar.Calendar(calendarEl, {
    ....
    dayMaxEvents: true, // allow "more" link when too many events
    dayMaxEvents: 2, // for all non-TimeGrid views
    // views: {
    //     timeGrid: {
    //         dayMaxEventRows: 6, // adjust to 6 only for timeGridWeek/timeGridDay
    //         dayMaxEvents: 2 // adjust to 6 only for timeGridWeek/timeGridDay
    //     }
    // },
    moreLinkContent:function(args){
        return '+'+args.num+' More items';
    },
    ....
});