JavaScript到Active Twitter Bootstrap工具提示

Question

我正在玩Twitter Bootstrap的工具提示 ，但是因为他们离开了Twipsy而遇到了问题。 更正JavaScript包含在页面中。

假设我有以下内容：

<p><a href="#" rel="tooltip" data-original-title="hello">hover on me</a></p>

什么是确切的JavaScript我需要使用，使工具提示出现？

提前致谢！

• 凡妮莎

Answer 1

您需要为必须具有工具提示的所有元素显式运行.tooltip() 。 例如，这将起作用：

<span rel="tooltip" title="tooltip text">some text</span>
...
<script src="/js/jquery.js"></script>
<script src="/js/bootstrap.js"></script>
<script type="text/javascript">
  $(document).ready(function () {
    $("[rel=tooltip]").tooltip();
  });
</script>

Answer 2

对于你的例子，它只是：

$('a').tooltip();

但根据文档，您应该使用title属性，而不是data-original-title 。 该属性由Bootstrap的工具提示代码添加。 此外，不需要rel="tooltip" 。

你的代码应该是：

HTML：

<a href="#" title="hello">hover on me</a>

JS：

$("a").tooltip(); // this will trigger a tooltip on all <a> elements

Answer 3

在Bootstrap中，我们需要手动初始化工具提示

它在文档中也提到了。

 <script type="text/javascript">
$(function () {
    $("[data-toggle='tooltip']").tooltip();
});</script>

Answer 4

你需要完全

  <script src="bootstrap-tooltip.js "></script>
  <script>
    $(function (){
$('a').tooltip();
 });