我的 fiddle 里有一个完整的日历 here将事件显示为每天单元格内的数字。是否有可能在触发日期点击或事件元素点击时用微调器替换数字。然后当我完成提取事件数据并显示等等时,我把数字放回去并隐藏微调器?
更新! - 当我像这样单击单元格内的元素时,我可以将单元格事件元素的值更改为微调器
eventLimitClick: function (cellInfo, jsEvent) {
var eventValue = $(cellInfo.moreEl).html();
$(cellInfo.moreEl).html('<i class="fa fa-circle-o-notch fa-spin fa-fw"></i>');
},
更新! - 我得到了点击显示微调器的一天
dayClick: function (date, jsEvent, view) {
var elementValue = $(jsEvent.target).text();
$(jsEvent.target).html('<div><a class="fc-more"><i class="fa fa-circle-o-notch fa-spin fa-fw"></i></a></div>');
但是当我触发一天的点击时,我很难改变它。回调中的“this”是一个“td”元素,用于与事件项值所用的不同的表。如果我能弄清楚如何更改包含 dayclick 值的元素,我就可以开始了!或者,如果我可以从一天的点击中触发 eventLimitClick,我会接受!!这可能吗?
下面是一些代码
$('#calendar').fullCalendar({
header: {
left: 'prev,next today',
center: 'title',
right: ''
},
//defaultDate: '2014-06-12',
defaultView: 'basicWeek',
editable: false,
height: 174,
eventLimit: 1,
eventLimitText: function(numEvents) {
return numEvents;
},
eventLimitClick: function (cellInfo, jsEvent) {
},
dayClick: function(date, jsEvent, view) {
},
events: [{
title: 'Event',
start: '2017-09-28'
},
{
title: 'Event',
start: '2017-09-28'
}
]
});
});
td.fc-more-cell {
text-align: center;
font-size: 2.3em;
}
.fc-row .fc-content-skeleton,
.fc-row .fc-content-skeleton td,
.fc-row .fc-content-skeleton table,
.fc-row .fc-content-skeleton tr {
height: 100%;
vertical-align: middle;
}
.fc-row .fc-content-skeleton td div {
display: inline-block;
line-height: 100%;
}
<div id='calendar'></div>
dayClick: function (date, jsEvent, view) {
var elementValue = $(jsEvent.target).text();
$(jsEvent.target).html('<div><a class="fc-more"><i class="fa fa-circle-o-notch fa-spin fa-fw"></i></a></div>');
我是一名优秀的程序员,十分优秀!