我想要自定义columnFormat到2行并设置其样式,如下所示:

javascript - fullcalendar,columnFormat html-LMLPHP

尝试columnFormat:'dddMMM dS'
结果:
<1iv c8/15/2016am00="1amy">Mon</1iv><1iv>Aug 10</1iv>

我如何自定义图片的columnHead?谢谢

最佳答案

columnFormat只需要一个字符串,但是您可以挂钩到viewRender并在那里进行修改

$('#calendar').fullCalendar({
  defaultView: 'agendaWeek',
  viewRender: renderViewColumns
});

function renderViewColumns(view, element) {
  element.find('th.fc-day-header.fc-widget-header').each(function() {
    var theDate = moment($(this).data('date')); /* th.data-date="YYYY-MM-DD" */
    $(this).html(buildDateColumnHeader(theDate));
  });

  function buildDateColumnHeader(theDate) {
    var container = document.createElement('div');
    var DDD = document.createElement('div');
    var ddMMM = document.createElement('div');
    DDD.textContent = theDate.format('ddd').toUpperCase();
    ddMMM.textContent = theDate.format('DD MMM');
    container.appendChild(DDD);
    container.appendChild(ddMMM);
    return container;
  }
}


https://jsfiddle.net/puhkv5qd/

可能会对此进行改进,但是使用jQuery 3.1.0,fullcalendar 2.9.0和2.14.1时,它在basicWeek,abstractWeek,basicDay,archiveDay视图上正常运行(不要在月视图上使用)

关于javascript - fullcalendar,columnFormat html,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/38945482/

10-12 12:19