我需要根据if条件改变事件的颜色

Question

$(document).ready(function() {
var SITEURL = "{{url('/')}}";
$.ajaxSetup({
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
}
});
var calendar = $('#calendar').fullCalendar({
editable: true,
events: SITEURL + "/fullcalendar",
displayEventTime: true,
editable: true,
eventRender: function(event, element, view) {
if (event.allDay === 'true') {
event.allDay = true;
} else {
event.allDay = false;
}
},
selectable: true,
selectHelper: true,
select: function(start, end, allDay) {
var title = prompt('Evente Title:');
var limit = prompt('Limite de alunos:');
if (title) {
var start = $.fullCalendar.formatDate(start, "Y-MM-DD HH:mm:ss");
var end = $.fullCalendar.formatDate(end, "Y-MM-DD HH:mm:ss");
$.ajax({
url: SITEURL + "/fullcalendar/create",
data: 'title=' + title + '&start=' + start + '&end=' + end + '&limit=' + limit,
type: "POST",
success: function(data) {
displayMessage("Added Successfully");
}
});
calendar.fullCalendar('renderEvent', {
title: title,
start: start,
end: end,
allDay: allDay
},
true
);
}
calendar.fullCalendar('unselect');
},
eventDrop: function(event, delta) {
var start = $.fullCalendar.formatDate(event.start, "Y-MM-DD HH:mm:ss");
var end = $.fullCalendar.formatDate(event.end, "Y-MM-DD HH:mm:ss");
$.ajax({
url: SITEURL + '/fullcalendar/update',
data: 'title=' + event.title + '&start=' + start + '&end=' + end + '&id=' + event.id,
type: "POST",
success: function(response) {
displayMessage("Updated Successfully");
}
});
},
eventClick: function(event) {
var deleteMsg = confirm("Do you really want to delete?");
if (deleteMsg) {
$.ajax({
url: SITEURL + '/fullcalendar/delete',
data: "&id=" + event.id,
type: "POST",
success: function(response) {
if (parseInt(response) > 0) {
$('#calendar').fullCalendar('removeEvents', event.id);
displayMessage("Deleted Successfully");
}
}
});
}
}
});
});
function displayMessage(message) {
$(".response").html("<div class='success'>" + message + "</div>");
setInterval(function() {
$(".success").fadeOut();
}, 1000);
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="container">
<div class="response"></div>
<div id='calendar'></div>
</div>

这段代码创建了一个完整的日历，默认情况下所有事件都是蓝色的，我需要当变量的值小于5时，颜色是绿色的，如果它大于5是红色的，我怎么能做到这一点?

我希望我可以在javascript中进行此更改，以便能够在同一应用程序中使用其他日历，以便能够改变颜色，因为我决定

Answer 1

你总是可以使用。style.

if(limit < 5){
event.style.color = "green"
}else if(limit > 5){
event.style.color = "red"
}

这里的Event指的是要切换颜色的元素。