34

我有一个链接，我想为它设置一个引导工具提示，并且我希望它也显示一个引导模式。为了显示模态代码是这样的：

<a href="#myModal" role="button" data-toggle="modal">Show</a>

以下将创建一个引导工具提示：

<a data-placement="right" data-toggle="tooltip" rel="tooltip" data-original-title='Hello' href="#"></a>

现在如何组合它。组合意味着有一个显示模式的链接并且也有一个引导工具提示？

4

6 回答 6

26

我发现了问题：

<a href="#myModal" role="button" data-toggle="modal" rel="tooltip" data-original-title='Hello'>Show</a>

就这样。

于 2013-08-02T12:37:41.600 回答
22

我宁愿使用这样的包装元素：

<span data-placement="right" data-toggle="tooltip" title="Hello">
    <a href="#myModal" role="button" data-toggle="modal">Show</a>
</span>

这对我来说似乎更直接。看到这个引导：http: //www.bootply.com/zqJRSAjSuQ

于 2014-11-20T11:10:19.440 回答
13

你可能还需要初始化它：我需要在页面底部初始化它。

        $("[rel='tooltip']").tooltip();
于 2013-12-25T10:44:56.127 回答
13

您不需要使用“data-toggle”作为工具提示，您可以更改为您想要的，例如“data-tt”：

<a href="#myModal" role="button" data-toggle="modal" data-tt="tooltip" title="hi">Show</a>

并在javascript中初始化：

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

提琴手

于 2015-08-01T14:55:18.090 回答
10

向元素添加数据属性：

<a data-toggle="modal" data-hover="tooltip" title="Click to Open" data-placement="right" href="#"></a>

并在javascript中初始化：

$("[data-hover='tooltip']").tooltip();
于 2015-02-19T21:22:39.633 回答
2

当工具提示错位时，您可能需要考虑使用 adiv而不是span元素...

根据 FL 的回答，这对我有用：

<div data-placement="right" data-toggle="tooltip" title="Hello">
    <a href="#myModal" role="button" data-toggle="modal">Show</a>
</div>
于 2014-12-18T11:01:31.950 回答