如何在 Bootstrap 中为一个链路设置多个数据切换？

jc3wubiy 于 2022-12-07 发布在 Bootstrap

关注(0)|答案(6)|浏览(122)

我有一个链接，我想为它设置一个引导工具提示，我也想让它显示一个引导模式。要显示一个模式，代码如下：

<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>

现在如何合并它。组合意味着有一个链接，显示模态，并有一个引导工具提示太？

6条答案

我发现了问题：

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

就这样

我更愿意使用这样的 Package 元素：

<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

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

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

并在javascript中初始化：

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

★可能还需要对它进行初始化：我需要在页面底部初始化它。

$("[rel='tooltip']").tooltip();

将数据属性添加到元素：

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

并在javascript中初始化：

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

当工具提示放错位置时，您可能需要考虑使用div而不是span元素...
根据F.L.的回答，这对我很有效：

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