Twitter引导工具提示指示不起作用？

Question

我注意到我的twitter bootstrap工具提示不尊重data-position.

所以,我前往Twitter Bootstrap工具提示演示,专门查看"X上的工具提示"示例,这就是我得到的:

看起来似乎没有对方向的支持？

但是,工具提示继承的popovers(或者可能是另一种方式？)工作:

浏览器试过:

在Ubuntu 12.10上的Ubuntu 12.10
Firefox 19.0上的Chromium 24.0

这是一个应该报告的错误,还是其他正在发生的事情？

Answer 1

Jsfiddle Jsfiddle与工具提示工作

它不是一个bug,但我们需要初始化它们.
重要的 Bootstrap网站声明"出于性能原因,工具提示和popover数据apis是选择性的,这意味着你必须自己初始化它们." Bootstrap网站工具提示部分

<div class="navbar tooltip-demo">
        <ul class="nav">
          <li><a class="top" title="" data-placement="top" data-toggle="tooltip" href="#" data-original-title="Tooltip on top">Tooltip on top</a></li>
          <li><a class="right" title="" data-placement="right" data-toggle="tooltip" href="#" data-original-title="Tooltip on right">Tooltip on right</a></li>
          <li><a class="bottom" title="" data-placement="bottom" data-toggle="tooltip" href="#" data-original-title="Tooltip on bottom">Tooltip on bottom</a></li>
          <li><a class="left" title="" data-placement="left" data-toggle="tooltip" href="#" data-original-title="Tooltip on left">Tooltip on left</a></li>
        </ul>
      </div>

要使用的javascript,您必须初始化

$('a').tooltip();

Answer 2

我发现用Bootstrap初始化工具提示的最简单方法是匹配他们的代码,这样你的任何工具提示都能正常工作.

$(function () {
    $("[data-toggle='tooltip']").tooltip();
});

或者您实际上可以将此行添加到bootstrap-tooltip.js文件的最后

}(window.jQuery);  //<-- last line of bootstrap-tooltip.js

$("[data-toggle='tooltip']").tooltip();

我基本上计划如果我要使用工具提示代码,那么我可能默认启用它.所以,我把它放在我的bootstrap-tooltip.js文件中.

Answer 3

我认为这是一个错误.从http://twitter.github.com/bootstrap/assets/js/application.js 可以看到使用'selector'选项调用演示.

$('.tooltip-demo').tooltip({
  selector: "a[data-toggle=tooltip]"
});

但是在处理'placement'时,bootstrap-tooltip.js中的'show'函数不会检查'selector'选项.因此发生了错误.

    placement = typeof this.options.placement == 'function' ?
      this.options.placement.call(this, $tip[0], this.$element[0]) :
      this.options.placement

这个bug的演示:http://jsfiddle.net/indream/xFC7G/
相关的github问题:https://github.com/twitter/bootstrap/issues/6832