当我在全日历中触发evenLimitClick事件时,我的弹出窗口不起作用。它在我的dayClick事件中可以正常工作,但在eventLimitClick中什么也没有发生。这是我的小提琴,我什至尝试设置要在父级上调用的popover(例如$(this).parent()。popover,但这也不起作用)。
$(document).ready(function () {
// page is now ready, initialize the calendar...
var eventsArray = [{
title: 'Test1',
start: new Date()
}, {
title: 'Test2',
start: new Date("2015-04-21")
}, {
title: 'Test3',
start: new Date("2015-04-21")
}];
$('#calendar').fullCalendar({
// put your options and callbacks here
header: {
left: 'prev,next', //today',
center: 'title',
right: ''
},
defaultView: 'month',
editable: true,
allDaySlot: false,
selectable: true,
events: eventsArray,
eventLimit: 1,
eventLimitClick: function (cellInfo, jsEvent) {
$(this).popover({
html: true,
placement: 'bottom',
container: 'body',
title: function () {
return $("#events-popover-head").html();
},
content: function () {
return $("#events-popover-content").html();
}
});
$(this).popover('show');
},
dayClick: function (cellInfo, jsEvent) {
$(this).popover({
html: true,
placement: 'bottom',
container: 'body',
title: function () {
return $("#events-popover-head").html();
},
content: function () {
return $("#events-popover-content").html();
}
});
$(this).popover('show');
},
})
});
<link href="https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/2.3.1/fullcalendar.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/2.3.1/fullcalendar.js"></script>
<div style="border:solid 2px red;">
<div id='calendar'></div>
<div id="events-popover-head" class="hide">Events</div>
<div id="events-popover-content" class="hide">Test</div>
</div>
在eventLimitClick事件中,更改以下内容:
$(this).popover
到
$(cellInfo.dayEl)
cellInfo.dayEl是要为其显示弹出框的单击的Day单元格元素。
我已经更新了小提琴也
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句