jquery - Bootstrap 3 弹出窗口可以使用外部 div 来存储内容吗？

Question

这里的所有示例 http://getbootstrap.com/javascript/#popovers使用带有 data-content 属性的弹出窗口的内联内容。

我想要做的是在我的页面上设置一个隐藏的 div 内容，并从弹出窗口触发器中定位它，例如:

<div id="myPopoverContent">
   ...stuff...
</div>

然后

<a ng-href="" data-toggle="popover"><span class="badge">12</span> You have 12 messages.</a>

作为触发器。但如何触发呢？

Answer 1

使用popover函数的content选项来传递内容:

{
    content: $('#myPopoverContent').text()
}

为了能够使用 HTML 内容，请使用:

{
    content: $('#myPopoverContent').html(),
    html: true
}

我准备了一个working example为你。