Bootstrap 工具提示不起作用

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 required Please note that all JavaScript plugins require jQuery to be included, as shown in the starter template. Consult our bower.json to see which versions of jQuery are supported.

您应该会在浏览器控制台中看到一条错误消息，告诉您：

Bootstrap's JavaScript requires jQuery

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

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

Bootstrap 工具提示不起作用

Bootstrap tooltip doesn't work

twitter-bootstrap

twitter-bootstrap-3