Bootstrap 弹出框只会加载一次。为什么？

Question

我有一个 Bootstrap popover，它只会显示一次，然后就不起作用了。我错过了什么？

这是我的JS Fiddle

Answer 1

问题是由于 $().load();，实际上它是异步的，当您第一次 return $("#pop-content").load(...); 时，它会 return 您 #pop-content [=30] 的内容=]，此后 #pop-content 的内容设置为您在 jQuery 加载中提到的 url 的结果，但在您的情况下它是空白的。

我用 $(#pop-content).html(); 替换了 $(#pop-content).load(...);，结果符合预期。

见Fiddle

编辑

$(document).ready(function () {
    $('.pop-form').popover({
        html: true,
        title: function () {
            return $("#pop-head").html();
        },
        content: function () {
           var result = '';
           $.ajax({
            url: "your url",
            async: false, 
            success:function(response){
                result = response;
            }
           });

           return result;
        }
    });

    // make popup larger
    var p = $('.popbutton').popover();
    p.on("show.bs.popover", function (e) {
        p.data()["bs.popover"].$tip.css("max-width", "630px");
    });
});

试试上面的代码，它应该可以正常工作。

Bootstrap 弹出框只会加载一次。为什么？

Bootstrap Popover will Only Load Once. Why?

javascript

jquery

ajax

twitter-bootstrap-3

popover