FullCalendar,如何在 eventClick 函数上更改事件 class
FullCalendar, how to change event class on eventClick function
我的日历使用来自 ajax-php 脚本的事件初始化。这些事件有一个简单的 css class,可用事件的背景色为绿色,不可用事件的背景色为红色。
我需要当我点击一个绿色的事件时,它会变成红色来设置这个不可用。
var calendarEl = document.getElementById('calendar');
$('#calendar').empty();
var calendar = new FullCalendar.Calendar(calendarEl, {
plugins: ['timeGrid'],
defaultView: 'timeGridWeek',
minTime: '08:00:00',
maxTime: '18:00:00',
allDaySlot: false,
weekends: false,
defaultDate: jdata.defaultDate,
contentHeight: 'auto',
locale: 'es',
eventClick: function (info) {
var dia = moment(info.event.start).format("DD/MM/YYYY");
var hora = moment(info.event.start).format("HH:mm");
if (info.event.classNames[0] == 'completo') {
return;
}
reservarSala(info.event, sala_id);
},
events: jdata.events
});
calendar.render();
documentation 表示可以使用 el
:
访问事件的 HTML 元素
var check_color = info.el.style.background
if (check_color == "green") {
info.el.style.background = "red"
} else {
info.el.style.background = "green"
}
我的日历使用来自 ajax-php 脚本的事件初始化。这些事件有一个简单的 css class,可用事件的背景色为绿色,不可用事件的背景色为红色。
我需要当我点击一个绿色的事件时,它会变成红色来设置这个不可用。
var calendarEl = document.getElementById('calendar');
$('#calendar').empty();
var calendar = new FullCalendar.Calendar(calendarEl, {
plugins: ['timeGrid'],
defaultView: 'timeGridWeek',
minTime: '08:00:00',
maxTime: '18:00:00',
allDaySlot: false,
weekends: false,
defaultDate: jdata.defaultDate,
contentHeight: 'auto',
locale: 'es',
eventClick: function (info) {
var dia = moment(info.event.start).format("DD/MM/YYYY");
var hora = moment(info.event.start).format("HH:mm");
if (info.event.classNames[0] == 'completo') {
return;
}
reservarSala(info.event, sala_id);
},
events: jdata.events
});
calendar.render();
documentation 表示可以使用 el
:
var check_color = info.el.style.background
if (check_color == "green") {
info.el.style.background = "red"
} else {
info.el.style.background = "green"
}