Question

我正在玩Bootstrap并试用工具提示，但它们似乎无法正常工作。我得到了以下简单的代码：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
    <title>Tooltip</title>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
    <script>
        $(function () {
          $('[data-toggle="tooltip"]').tooltip()
        })
    </script>
</head>
<body>
    <button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="left" title="Tooltip on left">Tooltip on left</button>

    <button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="top" title="Tooltip on top">Tooltip on top</button>

    <button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="bottom" title="Tooltip on bottom">Tooltip on bottom</button>

    <button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="right" title="Tooltip on right">Tooltip on right</button>
</body>
</html>

看起来像这样：http://i.gyazo.com/a1d844593410ac2c7c13546182317579.png

有人可以指出我的错误吗？

Answer 1

Bootstrap需要加载jQuery。来自official documentation：

需要jQuery 请注意，所有JavaScript插件都需要包含jQuery，如启动器模板中所示。请咨询我们的bower.json，了解支持哪些版本的jQuery。

您应该在浏览器控制台中看到错误，告诉您：

Bootstrap的JavaScript需要jQuery

在Bootstrap Javascript文件之前添加此行：

<script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>

Bootstrap工具提示不起作用

1 个答案: