彈出窗口不能與bootstrap一起使用？

Question

按照我復制的文檔 ：

<div class="container">
    <div class="row">
        <div class="bs-docs-example" style="padding-bottom: 24px;">
            <a href="#" class="btn btn-large btn-danger" rel="popover" data-content="And here's some amazing content. It's very engaging. right?"
            data-original-title="A Title">Click to toggle popover</a>
        </div>
    </div>
</div>

的jsfiddle

但它不起作用。 我究竟做錯了什么？

Answer 1

我通過做兩件事來完成它：

1. 由於Popover依賴於Tooltip，請確保在bootstrap-popover.js之前包含bootstrap-tooltip.js。

2. 用$('.container a').popover();這樣的行激活插件$('.container a').popover();

要讓彈出窗口位於頂部，請將data-placement="top"到a標記中。

Answer 2

彈出窗口默認情況下未初始化。 如果您包含全包bootstrap.js（v 2.2,2.3），請將其初始化為：

$('a[data-toggle=popover]').popover();

Answer 3

<a href="#" id="LinkId">Text</a>

在文件准備好了，

$("#LinkId").popover({ title: '', content: "Popover Content", placement: 'left|top|etc', trigger: 'hover' });

您只需要包含bootstrap.js 。