Question

我现在正在使用fullCalendar jQuery插件，我计划在eventClick上应用Twitter Modal Bootstrap。如何将此方法应用于我的日历插件？提前谢谢！

Answer 1

您可以通过执行以下操作来实现这一目标：

eventClick: function(event) {
    var modal = $("#modal");
    modal.find(".modal-title").html(event.title);
    modal.modal();
}

有关完整的代码和功能，请参阅以下jsfiddle

Answer 2

我刚看到这个问题，我认为这可能对某人有所帮助。这段代码对我有用：

$(document).ready(function() {
var $calPopOver;
$('#calendar').fullCalendar({
    defaultDate: '2015-07-23',
    header: {
        left: 'prev,next today',
        center: 'title',
        right: 'month,agendaWeek,agendaDay'
    },
    eventMouseover: function (date, allDay, jsEvent, view) {
        $(this).children().popover({
            title: '<p>Lorem ipsum dolor sit amet</p>',
            placement: 'right',
            content: 'Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.',
            html: true,
            container: 'body'
        });
        if($calPopOver)
            $calPopOver.popover('destroy');
        $calPopOver = $(this).children().popover('show');
    },
    eventLimit: false, // allow "more" link when too many events
            events: [
            {
                title: 'All Day Event',
                start: '2015-07-04'
            },
            {
                title: 'Long Event',
                start: '2015-07-18',
                end: '2014-07-19'
            },        
            {
                title: 'Click for Google',
                url: 'http://google.com/',
                start: '2015-07-23'
            }
        ]
}); });

要获得悬停效果，您可以从“eventClick”更改为“eventMouseover”

http://jsfiddle.net/MadalinaTn/1Lmejhmx/2/

如何在fullcalendar事件点击上应用twitter模态弹出窗口

2 个答案: