引导弹出窗口卡在全日历中答案

【问题标题】：Bootstrap popover get stuck in fullcalendar引导弹出窗口卡在全日历中
【发布时间】：2018-12-04 17:11:05
【问题描述】：

我正在使用引导弹出框在全日历中呈现事件。当我悬停事件时，它可以很好地显示事件详细信息，但是当我尝试调整事件大小时，每次调整事件大小时都会创建弹出框，并且弹出框卡住但永远不会淡出。这是截图

这是我的 eventRender 代码

 eventRender: function(event, element) {
                   $(element).popover({
                       title: 'Title: ' + event.title,
                       placement: 'right',
                       trigger: 'hover',
                       container: 'body',
                       html:true,
                       content: 'Start: ' + event.start.format("MMM DD YYYY HH:MM:SS") + '<br />End: ' + event.end.format("MMM DD YYYY HH:MM:SS") + '<br/>Description:' + event.description,
                   });
               },

如果我在弹出窗口中删除容器属性，它在任何情况下都可以正常工作，但弹出窗口显示受月视图中日历行的限制。 bounded popover

Nb：我为我糟糕的英语道歉

【问题讨论】：

你能把它放在一个jsfiddle吗？
这里是 jsfiddle jsfiddle.net/nzxyY/282 。但我不能在那里调整事件的大小。我不知道为什么。我已经从另一个小提琴中分叉了代码并进行了一些修改，因此代码看起来像我的项目中的完整日历代码，但事件源除外。我不能把我自己的代码放在 jsfiddle cz 里面太复杂了。我的 fullcalender 已经有了 MySQL 的 CRUD 事件。抱歉，我花了一些时间来使用 jsfiddle。这是我第一次使用它。
感谢重播。

标签： javascript jquery twitter-bootstrap fullcalendar

【解决方案1】：

对我来说，@Angainor 的回答部分起到了作用。事实上，当我们完成调整大小时，所有弹出框都消失了，但在调整大小期间仍然有多个弹出框。这是我设法修复的方法

$('#calendar').fullCalendar({
eventResize: function(event, delta, revertFunc) { // Angainor's fix still needed
    $('.popover.fade.top').remove();
},
eventRender: function(eventObj, $el) { // Complementary to Angainor's fix
    $el.mousemove(function(e) {
        if (e.which === 1) {
            $('.popover.fade.top').remove();
        }
    }
},

...

【讨论】：

【解决方案2】：

同样的问题。我发布我的解决方案以帮助未来的开发人员：

我在“eventResize”函数中销毁了弹出框。效果很好：

$('#calendar').fullCalendar({
    eventResize: function(event, delta, revertFunc) {
        $('.popover.fade.top').remove();
    },
...

【讨论】：