Question

我可以在控制台中看到我的数据在popover中填充，但它根本没有响应我的点击事件，这有点让人抓狂。

这里是包含popover的函数的snibbet：

$(function(){
    $(".run-btn").click(populateSteps);
    $(".run-all-suite").click(getId);
    $(".run-all-btn").click(runAll);
    $('[data-toggle="popover"]').popover();
});

var table_draw = '<table class="table table-bordered"><tr><th>Title</th><th>Status</th><th>Holly</th><th>Call ID & TestRail ID</th><th>Failure reason</th></tr>';
                $.each(cases.cases, function (index, value) {
                    var popupControl = "<button type='button' class='btn btn-default' data-container='body' data-toggle='popover' data-content='" + value.script + "' data-original-title='' title=''></button>";
                    table_draw += "<tr><td class='title col-xs-2'>" + value.title + popupControl +"</td>" +
                    "<td class='status col-xs-1'><i class='fa fa-spin fa-spinner'></i><span> Running...</span></td>" +
                    "<td class='holly col-xs-1'>" + cases.holly + "</td>" +
                    "<td class='call-id col-xs-1'></td>" +
                    "<td class='reason col-xs-2'></td></tr>";

                    $('body').on('click', function (e) {
                        $('[data-toggle="popover"]').each(function () {

                            if (!$(this).is(e.target) && $(this).has(e.target).length === 0 && $('.popover').has(e.target).length === 0) {
                                $(this).popover('hide');
                            }
                        });
                    });
                });

控制台输出：

我的参考文件的顺序：

<!-- Load Bootstrap JS source for popover -->
        <script src="{% static 'common/jquery/1.10.2/jquery.min.js' %}"></script>
        <script src="{% static 'common/tooltip/tether.min.js' %}"></script>
        <script src="{% static 'common/bootstrap/3.3.5/dist/js/bootstrap.min.js' %}"></script>

这是一个Django项目。 popover位于一个JS文件中，该文件在显示的页面上引用，该文件是dashboard.html：

<script>
{% include 'runner/dashboard.js' %}
</script>

base.html文件包含上面的js引用，这些引用也在显示页面上引用 {％extends＆＃39; core / base.html＆＃39; ％}

我之前在另一个项目上创建过popovers，但无论出于什么原因它都不会出现给我，它会让我发疯。如果你能提供帮助，或者如果我需要提供别的东西来帮助你，我会帮助你。

Answer 1

鉴于您向我们展示的内容，在document.ready（）触发时，table_draw的内容尚未呈现为HTML的几率非常高。您需要在页面上实际存在之后注册事件监听器（$（'[data-toggle =“popover”]'）。popover（）; line）。

Bootstrap Popover没有响应click事件

1 个答案: