引导程序中的弹出插件不起作用答案

【问题标题】：popover plugin from bootstrap not working引导程序中的弹出插件不起作用
【发布时间】：2012-03-12 23:02:39
【问题描述】：

这是我的问题：我在 javascript 和 jquery 中是 lvl 0。（我用 GWT 开发 webapps 所以我不用写 js）

我想使用popover plugin from bootstrap，但我不知道如何使用，即使它看起来很简单。

这就是我所拥有的：

<html>
<head>
<link type="text/css" rel="stylesheet" href="css/bootstrap.css">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="js/bootstrap.js"></script>
</head>
<body>

    <a id="mylink" data-content="my txt" data-original-title="my title"> lol </a>

    <script type="text/javascript">
        $("#myLink").popover();
    </script>
</body>
</html>

这没有任何作用。

我应该使用“$(document).ready()”吗？我错过了选择吗？我看到有人添加这个方法调用：

.mouseenter(function(e) { $(this).popover('show'); });

但这也没有改变。

我知道这是真正的菜鸟，但我真的迷路了。

谢谢:)

【问题讨论】：

你的开始正文标签搞砸了....
我还建议使用您的浏览器开发工具来查看是否有错误。
如果您想知道它的内容，请查看this jQuery document-ready tutorial。
如果你正在与一个 DOM 元素交互，你应该使用 document ready。

标签： jquery twitter-bootstrap

【解决方案1】：

似乎 Bootstrap 需要一个相当新版本的 jquery。所以把jquery引用改成

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>

并将$('#myLink') 更改为$('#mylink')。

【讨论】：

【解决方案2】：

您的 HTML 应包含以下内容以使弹出框正常工作：

此代码等待页面加载，然后在您的链接上启用弹出窗口。

<script type="text/javascript">
    $(document).ready(function() {   
        $('#mylink').popover();
    });
<script>

包括 jquery 和 popover javascript。

<script src="js/jquery.js"></script>
<script src="js/bootstrap-popover.js"></script>

【讨论】：