我正在尝试更改日历中所选日期的背景颜色。在我的下面的代码中,它突出显示所有点击的日期,我怎样才能只突出显示最后点击的日期?
dayClick: function (day){
var mydate = new Date(this[0].getAttribute("data-date"));
var dateArray = mydate.toDateString().split(" ");
document.querySelectorAll(".calendar-mobile p")[0].innerHTML = j_monthNames[mydate.getMonth()] + " " + mydate.getDate() + "日" + "(" + j_dayNames[dateArray[0].toLocaleLowerCase()] + ")";
document.body.classList.remove("calendar-open");
$month = '' + (mydate.getMonth() + 1);
$day = '' + mydate.getDate();
$year = mydate.getFullYear();
if ($month.length < 2) $month = '0' + $month;
if ($day.length < 2) $day = '0' + $day;
$dates = [$year, $month, $day].join('-');
$('[data-date='+$dates+']').css({"color": "red", "backgroundColor": "yellow",});
},
我最终是这样解决的:
$(document).ready(function() {
$('#calendars').fullCalendar({
header: {
left: 'prev',
center: 'title',
right: 'next'
},
selectable: true,
});
});
.fc-highlight {
background: green !important;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.0.1/fullcalendar.min.css" defer/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.16.0/moment.min.js" defer></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.0.1/fullcalendar.min.js" defer></script>
<div id="calendars"></div>
刚刚触发了.fc-highlight
类,它就起作用了。
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)