Fullcalendar：更改特定日期的颜色
我遇到了一个我上class的项目。 我需要改变一些天的背景颜色。 这是一个用户应该看到的日历，哪些日期可用，哪些日期不可用。 我发现有一个名为“data-date”的属性，但我没有找到使用它的可能性。
有没有办法操纵特定日子的背景？
我认为必须有一种方法，因为显示当前日期的单元格也有另一种颜色。
对于views month ， basicWeek和basicDay您可以通过提供dayRender函数来更改日期的呈现。 例如：
$("#calendar").fullCalendar({ dayRender: function (date, cell) { cell.css("background-color", "red"); } });
dayRender的文档可在此处获取： http ： dayRender
这里有一个关于jsfiddle的工作示例： http ： //jsfiddle.net/kvakulo/CYnJY/4/
dayRender: function(date, cell){ if (moment().diff(date,'days') > 0){ cell.css("background-color","silver"); } },
对于那些只想改变过去日期颜色的人，请在你的css中定位.fc-past并添加background-color属性。 例如，：
.fc-past { background-color: silver; }
如果任何人想要jquery fullcalendar前一整天红色（或任何其他）有色，那么这就是代码。
var $calendar = $('#calendar').fullCalendar({ header: { left: 'prev,next today', center: 'title', right: 'month,basicWeek,basicDay' }, defaultView: 'month', dayRender: function (date, cell) { var check = $.fullCalendar.formatDate(date,'yyyy-MM-dd'); var today = $.fullCalendar.formatDate(new Date(),'yyyy-MM-dd'); if (check < today) { cell.css("background-color", "red"); } } });
Regin Larsen代码帮助我实现了这个目标。 感谢Regin Larsen。
为什么不使用“data-date”属性？
$("#calendar").fullCalendar(function() { viewRender: function() { $("[data-date="+$.fullCalendar.formatDate(new Date(), "yyyy-MM-dd")+"]").css("background-color", "red"); }, ....
使用外部库时，应尽量不要利用库生成的任何内容。 因为在下一个版本中，如果它们改变了库在内部工作的方式，那么库仍然可以向后兼容，但是代码将停止工作。 因此，尽量使用库API而不是做黑客。
回答你的问题，一种方法是，在所有不可用的日子里添加一个新事件。 这可以通过创建事件对象和执行renderEvent（.fullCalendar（’renderEvent’，event [，stick]））来完成。 创建事件对象时，将背景颜色指定为所需的颜色，并将颜色，文本颜色，边框颜色设置为与背景相同，如果您不希望它可见。
编辑：Regin Larsen的回答似乎更好。 我在文档中没有注意到。
要使用特定日期的日期参数进行比较：
$("#calendar").fullCalendar({ dayRender: function (date, cell) { if (date.isSame('2016-08-04')) { cell.css("background-color","red"); } } });
isSame来自moment.js，由fullcalendar使用： http ：//momentjs.com/docs/#/query/is-same/
getDate无法正常工作我猜，请改用。
里面的var calendar = $('#calendar').fullCalendar({ ... }
dayRender: function (date, cell) { var today = moment('2018-06-22T00:00Z'); if (date.isSame(today, "day")) { cell.css("background-color", "blue"); } },