我有Bootstrap 4文档中的按钮:

<button type="button" class="btn btn-secondary" data-container="body" data-toggle="popover" data-placement="top" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus.">
  Popover on top
</button>


和下面的方法:

$(function () {
  $('[data-toggle="popover"]').popover({
    container: 'body',
    trigger: 'click',
  })
})


检查HTML时,我看到有一个新的div显示为<div class="popover fade top in"..
这是不可见的。检查元素时,它具有一个隐藏它的类:

.fade:not(.show){
  opacity: 0;
}


取消拖拽,按预期显示弹出窗口。
任何线索,我在做什么错?

最佳答案

问题在于选择弹出框上的类。如您所言,.fade:not(.show)开始,但您的课程是<div class="popover fade top in"..。因此,问题在于它使用了.in而不是.show。因此,我认为版本之间会有差异,因为我认为引导程序3中的弹出式窗口曾经使用in,而引导程序4中使用的是show

您是否使用引导程序事件在某个地方手动设置了此设置?还是您导入了错误版本的bootstrap.js?

10-05 20:47
查看更多