Question

我有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;
}

取消叠加，按预期显示弹出窗口。有任何线索，我在做什么错了？

Answer 1

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

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

弹窗不透明：显示为0

1 个答案: