Full calendar V4 - 点击一个事件,如何改变日期的颜色
Full calendar V4 - on click of an event, how to change the color of the date(s)
我正在使用月视图。我显示所有日期,我想将每一天标记为 'working day'、'overtime day'、'holiday' 等
我将上面的每个标签都设置为事件,并且显示正常。我的下一个目标是 select 约会并申请休假。当我点击某一天时,它会触发 dateClick 并且我将背景颜色更改为绿色。如果我再次 select 相同的日期,我会将背景颜色改回白色。这给人一种用户 selects/unselects 约会的感觉。可以像这样 select 编辑多个日期,颜色会变成绿色,我会维护一个 select 编辑日期的列表。
if (info.dayEl.style.backgroundColor == 'green') {
info.dayEl.style.backgroundColor = 'white';
} else {
info.dayEl.style.backgroundColor = 'green';
}
问题:当我点击一天中的事件(如加班等)时,我无法更改当天整个单元格的背景颜色。
单击事件时,会触发 eventClick,我尝试从该函数中执行
来触发 'select'
this.fullCalendarMonthly.getCalendar().select(info.event.start);
但它没有任何 html 元素和样式。
还有其他方法可以实现吗?
点击事件时,我循环使用 css 类 来完成它。
var week = info.el.closest(".fc-content-skeleton").closest(".fc-week");
var days = week.querySelectorAll(".fc-day");
days.forEach(day => {
if (day.attributes["data-date"].value == currentDate) {
day.style.backgroundColor = '#123';
}
});
我正在使用月视图。我显示所有日期,我想将每一天标记为 'working day'、'overtime day'、'holiday' 等
我将上面的每个标签都设置为事件,并且显示正常。我的下一个目标是 select 约会并申请休假。当我点击某一天时,它会触发 dateClick 并且我将背景颜色更改为绿色。如果我再次 select 相同的日期,我会将背景颜色改回白色。这给人一种用户 selects/unselects 约会的感觉。可以像这样 select 编辑多个日期,颜色会变成绿色,我会维护一个 select 编辑日期的列表。
if (info.dayEl.style.backgroundColor == 'green') {
info.dayEl.style.backgroundColor = 'white';
} else {
info.dayEl.style.backgroundColor = 'green';
}
问题:当我点击一天中的事件(如加班等)时,我无法更改当天整个单元格的背景颜色。
单击事件时,会触发 eventClick,我尝试从该函数中执行
来触发 'select'this.fullCalendarMonthly.getCalendar().select(info.event.start);
但它没有任何 html 元素和样式。
还有其他方法可以实现吗?
点击事件时,我循环使用 css 类 来完成它。
var week = info.el.closest(".fc-content-skeleton").closest(".fc-week");
var days = week.querySelectorAll(".fc-day");
days.forEach(day => {
if (day.attributes["data-date"].value == currentDate) {
day.style.backgroundColor = '#123';
}
});