微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

将引导程序升级到最新版本4.5.2时,不显示popover

如何解决将引导程序升级到最新版本4.5.2时,不显示popover

当我们将bootstrap.js升级到最新版本时,弹出窗口不可见。

检查元素时该元素是可见的,但未在UI中显示。 我们已经添加了popper.min.js以及bootstrap-js升级

<a tabindex="0" role="button" class="btn btn-danger btn-block" data-bind="visible: testvisible" id="btnDeleteSource" data-container=".modal-body" data-toggle="popover" data-trigger="focus" data-placement="bottom" data-html="true" title="Test Delete" data-content='<p>test</p><button type="button" role="button" class="btn btn-danger btn-block" ng-click="Test click" id="btnConfirmDeleteSource">Delete</button>'>Delete Configuration</a>

js文件

 function setupBootstrap() {
        $("[data-toggle=popover]").popover({ html: true })
            .click(function (ev) {
                $compile($(".popover.in").contents())($scope);
            });
        $("[data-toggle=tooltip]").tooltip({ container: "body" });
    }

我在bootstrap.min.js之前加入了popper.min.js,我认为其中包含Popper.js才能使弹出窗口起作用。 Popover正在呈现,正如我在控制台的HTML中看到的那样,它带有class = popover in fade bs-popover-bottom show类。它在早期版本的引导程序中正常运行,并且使用class = popover fade bottom in类进行渲染。 我没有在浏览器中看到任何控制台错误。 我只升级了bootstrap.js而不是bootstrap.css

此外,弹出框内使用的按钮单击不显示

我已经尝试了以下方法解决此问题,但仍然无法正常工作, 在JavaScript中手动调用了.popover()

$(function () {
$('[data-toggle="popover"]').popover() })

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。