Twitter Bootstrap提示框方向无法正常工作？

Question

我注意到我的 Twitter Bootstrap 工具提示没有遵循 data-position。因此，我前往Twitter Bootstrap 工具提示演示，特别是查看“在 X 上的工具提示”示例，结果如下：

看起来没有支持方向？

但是，工具提示继承自弹出窗口（或者可能是反过来的？），它们可以正常工作：

尝试过的浏览器：

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

这是应该报告的错误吗，还是其他情况？

- Hailwood

Answer 1

Jsfiddle 带有工作提示的Jsfiddle

这不是一个bug，但我们需要初始化它们。
重要Bootstrap网站指出：“出于性能原因，工具提示和弹出框数据API是选择加入的，这意味着您必须自己初始化它们。”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();

- Shail

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文件中。

- M.Hoover

Answer 3

我认为这是一个错误。从http://twitter.github.com/bootstrap/assets/js/application.js中可以看出，演示是通过“selector”选项调用的。

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

但是在bootstrap-tooltip.js中的“show”函数在处理“placement”时不会检查“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

- inDream

---

很好，你发现了Bootstrap演示中确实存在问题。 - David Taiaroa