参考文章：https://www.cnblogs.com/wm218/p/10869823.html

tooltip (提示框) 是一个小小的弹窗，在鼠标移动到元素上显示，鼠标移到元素外就消失。

属性

常用的功能，可以通过以下属性来设置：

实例：

<a href="#" id="text" data-toggle="tooltip" title="这是一段显示的文字" data-placement="right" data-trigger="hover">右边显示内容</a>
<script>
$(function(){
    $('[data-toggle="tooltip"]').tooltip(); // 也可以使用 $('#text').tooltip(); 来启用弹窗
});
</script>

方法

还可以通过tooltip的option设置来实现更多功能，tooltip函数原型： 

$obj.tooltip({
    title: '', // 提示框显示的文本内容。如果同时设置了属性的title，则优先属性title设置
    placement: '[left | top | right | bottom]', // 等同于data-placement，级别优先于data-placement设置
    html: [true | false], // 等同于data-html，级别优先于data-html设置
    animation: [true | false], // 等同于data-animation，级别优先于data-animation设置

    delay: [数值], // 等同于data-delay，级别优先于data-delay设置
    // 也可以设置显示延迟 或 隐藏延迟，如下：
    delay: {
        show: [数值], // 显示延迟
        hide: [数值]  // 隐藏延迟
    },

    trigger: '[click | hover | focus | manual]', // 等同于data-trigger，级别优先于data-trigger设置

    container: [string | false], // 等同于data-container,

    selector: [string | false], // 选择器，设置某一对象下指定的元素为tooltip组件

    template: [string] // 默认值：'<div class="tooltip" role="tooltip"><div class="arrow"></div><h3 class="popover-title"></h3><div class="popover-content"></div></div>                          //  缺省下tooltip样式是黑底白字，可以通过这个属性自定义样式。
});