Question

我知道我已经搜索了所有问题并回答了几次该问题，但是我不明白为什么我的代码不起作用或哪里出了问题。日历显示事件，但是当我单击事件时，不会出现模式弹出窗口。任何帮助将不胜感激

css && js

bootstrap.min.css
jquery-3.3.1.min.js
bootstrap.min.js
fullcalendar-3.10.0/fullcalendar.css
fullcalendar-3.10.0/lib/jquery-ui.min.js
fullcalendar-3.10.0/lib/jquery.min.js
fullcalendar-3.10.0/lib/moment.min.js
fullcalendar-3.10.0/fullcalendar.js
fullcalendar-3.10.0/gcal.js


Javascript

$(document).ready(function(){
    $('#id_btn_showEvents').click(function(){
        $('#mcoCalendarForm').submit();
        pleaseWait();
    }); 
     $('#calendar').fullCalendar({
        header: {
            left: 'prevYear,prev,next,nextYear today',
            center: 'title',
            right: 'month,agendaWeek,agendaDay,listWeek'
        },
        defaultDate: new Date(),
        navLinks: true,
        editable:false,
        eventLimit: true,
        eventColor: '#1D5C90',
        events: ${eventJson},          
        dayRender: function(date, cell) {
            var today = $.fullCalendar.moment();
            var end = $.fullCalendar.moment().add(7, 'days');
                $("th.fc-"+date.format('ddd').toLowerCase()).css("background", "#1E5D91");
                $("th.fc-"+date.format('ddd').toLowerCase()).css("color", "#f8f9fa");
        },
        eventClick: function(event, jsEvent, view) {
            alert("in event click");
            $('#modalTitle').html(calEvent.title);
            $('#modalBody').html(calEvent.title);
            $('#calendarModal').modal();

        }

    });

});
<div class='col-md-11'>
    <div id='calendar' class='mcoCal' style="padding: 15px;"></div>
</div> 
<div id="calendarModal" class="modal fade">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span> <span>close</span></button>
                <h4 id="modalTitle" class="modal-title"></h4>
            </div>
            <div id="modalBody" class="modal-body"> </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            </div>
        </div>
    </div>
</div>

Answer 1

经过大量研究，我发现页面中两次引用了jquery.min.js。

删除fullcalendar-3.10.0/lib/jquery.min.js

后，现在正在显示模态窗口

引导模态不适用于完整日历中的eventClick功能

1 个答案: