Question

我遇到了bootstrap popover的问题，即使我在stackoverflow上阅读了一些帖子，我也一直对此感到困惑。这是我的完整代码，弹出窗口不起作用。我不知道为什么。有人能帮助我吗？

<!DOCTYPE html>
<html>

<head>
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.3.1/js/bootstrap-    popover.js"></script>
<script src="http://w3resource.com/twitter-bootstrap/twitter-bootstrap-v2/js/bootstrap-tooltip.js"></script>
<script>
$(document).ready(function() {
    $('.moreoption').popover({
        placement : 'top', // top, bottom, left or right
        title : 'This is my Title', 
        html: 'true', 
        content : 'hi'
    });
});
</script>
</head>
<body>
<a href="#" title="" class="moreoption" style="color:black;font-size:13">more</a>
</body>
</html>

我想问的另一个问题是，当我们想在bootstrap中使用popover工具提示功能时，我们是否需要包含文件“bootstrap-tooltips.js”和“bootstrap-popover.js”作为我们的js资源？或者我们只需要包含“bootstrap.min.js”？

真的很感激。

Answer 1

看起来你正在整个加载Bootstrap 3，然后在它上面翻转Bootstrap 2的Popover和Tooltip文件。你正在加载两部分Bootstrap，还有两个不同的版本。删除Bootstrap 2文件，您应该开展业务。

要回答您的后续问题，您可以选择加载所有Bootstrap或仅加载所需的组件。无需两者兼顾。

您还需要加载Bootstrap CSS文件：http://www.bootstrapcdn.com

http://jsfiddle.net/isherwood/saAAk/

$(document).ready(function () {
    $('.moreoption').popover({
        placement: 'top', // top, bottom, left or right
        title: 'This is my Title',
        html: 'true',
        content: 'hi'
    });
});

Bootstrap popover永远不适合我

1 个答案: