在Fullcalendar上色周末

Question

我正在使用FullCalendar组件,我需要为周末,周五和周六上色.我在这里推荐使用以下内容: 我可以在每月fullCalendar显示上为周末设置不同的颜色

$('table.calendar > tbody > tr > td:nth-child(-n+2)').addClass('fc-weekend');

我还添加了css类.

这是我的代码,周末没有颜色......任何建议!

$(document).ready(function() {
    var date = new Date();
    var d = date.getDate();
    var m = date.getMonth();
    var y = date.getFullYear();
    $.getJSON('[@spring.url '/loadSomeData'/]', function (data) {
      $.getJSON('[@spring.url '/loadOtherData/]', function (info) {
        information = returnedPublicVacation;

        var calendar = $('#calendar').fullCalendar({
          header: {
            left: 'prev,next today',
            center: 'title',
            right: 'month,agendaWeek,agendaDay'
          },
          selectable: true,
          selectHelper: true,
          select:
            function(start, end, allDay) {
              vacationStart = start;
              showTheCorrectDialog(vacationStart);
            },

          eventClick: function(calEvent, jsEvent, view) {

            showTheCorrectDialog(calEvent.start);

            // change the border color just for fun
            $(this).css('border-color', 'red');
          },

          editable: true,
          events:data.concat(information)
        });
        resourceVacation = data;
      });
    });

    $('table.calendar > tbody > tr > td:nth-child(-n+2)').addClass('fc-weekend');
  });

Answer 1

你在css文件中为类添加了样式吗？

你也可以试试这个:

.fc-fri { color:blue; }
.fc-sat { color:red;  }

(或.fc-sun for Sunday)你可以在这里看到这样的例子:http://jsfiddle.net/rajesh13yadav/nf9whojL/1/

Answer 2

在版本 4 中，您可以使用“ daysOfWeek ”为所有星期日或其他日子添加事件。

    events: [
    {
      daysOfWeek: [0,6], //Sundays and saturdays
      rendering:"background",
      color: "#ff9f89",
      overLap: false,
      allDay: true
    }]

我建议您使用此方法，因为您可以使用服务器端脚本语言（例如 PHP、Node.js、JavaScript 等）轻松更改它