Question

重现问题的方法：
当我将可拖动元素（从Fullcalendar外部）拖到Fullcalendar上然后启动Bootstrap模式时，模态背景覆盖模态。相反，当我没有将可投放元素放到日历上时，模态是可见的，而模态背景并未覆盖模态。

其他信息：
当我在Fullcalendar中拖放元素时，Bootstrap模式运行良好。

我确信：

Bootstrap模式位于<body></body>标记之间。

Fullcalendar初始化：

$('#calendar').fullCalendar({
locale:'pl',
header: {
    left: 'prev,next today',
    center: 'title',
    right: 'month,agendaWeek,agendaDay'
},
views: {
    month: { 
        editable: false,
        droppable: false,
    }
},
slotDuration: '00:15:00',
droppable: true,
defaultDate: date,
defaultView: viewName,
editable: true,
timeFormat:'H(:mm)',
minTime: "07:00:00",
maxTime: "18:00:00",
allDaySlot: false,
events: eventsArray,
eventRender: function(event, element) {
    element.find(".fc-event-title").remove();
    element.find(".fc-event-time").remove();
    element.find(".fc-time").remove();
    var new_description =   
            moment(event.start).format("HH:mm") + '-'
            + moment(event.end).format("HH:mm")
    ;
    element.append(new_description);
},
dayRender: function (date, cell) {

    var date = moment(date).format("YYYY-MM-DD");

    for(var i in holidays) {
        if(date === holidays[i].date) {
            cell.css("background-color", "#FFCBCB");
        }
    }   

},

});

模态初始化：

var modal = $('#addElementModal');
modal.modal();

Answer 1

我已找到此案例的解决方案：

我已将<div class="modal">...modalcontent...</div>添加到以下属性中：

data-backdrop="false" style="background-color: rgba(0, 0, 0, 0.5);"

这只是删除模态背景并添加它自己的背景。

Bootstrap背景在Fullcalendar上删除元素后覆盖模态

1 个答案: