在我的特殊情况下，它没有工作，因为我包含了两个版本的jQuery。一个用于引导，另一个(另一个版本)用于谷歌图表。

当我移除图表的jQuery加载时，它工作得很好。

我知道这是一个老问题，但因为我有这个问题与新发布的引导，它在网站上不清楚，这里是如何启用工具提示。

给元素一个类似"tooltip-test"的类

然后在javascript标签中激活这个类:

<script type="text/javascript">
    $('.tooltip-test').tooltip();
</script>

<a href="#" class="tooltip-test" title="" data-original-title="Tooltip">This link</a>

在我的特殊情况下，它没有工作，因为我包含了两个版本的jQuery。一个用于引导，另一个(另一个版本)用于谷歌图表。

当我移除图表的jQuery加载时，它工作得很好。

工具提示和弹出窗口不仅仅是css插件，比如下拉菜单或进度条。要使用工具提示和弹出窗口，你必须使用jquery(阅读javascript)激活它们。

假设我们想要在点击html按钮时显示一个弹出窗口。

<a href="#" role="button" 
     class="btn popovers-to-be-activated" 
     title="" data-content="And here's some amazing content." 
     data-original-title="A Title" "
>button</a>

然后你需要有以下javascript代码来激活弹出窗口:

$('.popovers-to-be-activated').popover();

实际上，上面的javascript代码将在所有具有类“popover -to- activated”的html元素上激活弹出窗口。

不用说，把上面的javascript放在DOM-ready回调中，一旦DOM准备好就激活所有弹出窗口:

$(function() {
 // Handler for .ready() called.
 $('.popovers-to-be-activated').popover();
});

快速和更轻的选择Bootstrap工具提示插件:

HTML:

<div>
    <div class="mytooltip" id="pwdLabel">
        <label class="control-label" for="password">Password</label>

        <div class="mytooltiptext" id="pwdLabel_tttext">
            6 characters long, must include letters and numbers
        </div>                                

    </div>

    <input type="password" name="password" value="" id="password" autocomplete="off"
           class="form-control" 
           style="width:125px" />
</div>

CSS:

<style>
    .mytooltiptext {
        position: absolute;
        left: 0px;
        top: -45px;
        background-color: black;
        color: white;
        border: 1px dashed silver;
        padding:3px;
        font-size: small;
        text-align: center;
    }

    .mytooltip {
        position: relative;
    }

    .mytooltip label {
        border-bottom: 1px dashed black !important;
    }
</style>

JSCRIPT:

$(".mytooltip").mouseover(function(){
    var elm = this.id;
    $("#" + elm + "_tttext").fadeIn("slow");
});

var ttTmo;
$(".mytooltip").mouseout(function(){
    var elm = this.id;
    clearTimeout(ttTmo);
    ttTmo = setTimeout(function(){
        $("#" + elm + "_tttext").fadeOut("slow");
    },3000);
}); 

标签/文本必须包含在类“mytooltip”的包装器中，该包装器必须有一个Id。

标签之后是工具提示文本，包装在类“mytooltiptext”的div中，id由父包装器的id +“_tttext”组成。可以使用其他选择器选项。

希望能有所帮助。

如果你正在用javascript创建包含工具提示的html，然后将其插入到文档中，你必须在插入html到文档后激活弹出窗口/工具提示，而不是在文档加载时…