Bootstrap popover显示远程链接内容

Question

我想在某个元素上使用bootstrap popover。当鼠标悬停在该元素上时，弹出框中将显示远程URL内容。

如果您想使用AJAX，我找到了这个建议的解决方案： https://groups.google.com/forum/#!topic/twitter-bootstrap-stackoverflow/8MtpL1vEUOU

但我认为可能有一种更简单的方法。

有什么建议吗？

Answer 1

使用此代码：

<a href="/" class="btn btn-default btn-pop-over-element" data-container="body" data-toggle="popover" data-placement="top">
  Popover on top
</a>

<script>

$('.btn-pop-over-element').click(function (e) {
    e.preventDefault();
    $.ajax({
        url: $(this).attr('href'),
        success: function () {
            $('.btn-pop-over-element').popover({content: '<p>This is a test content</p>', title: 'Test Title', html :true}).popover('show');    
        }
    })
});
</script>

您还可以根据您从ajax电话中收到的回复更改标题和内容。您也可以根据需要更改href网址。