如何使用Bootstrap工具提示？

Question

我使用了Bootstrap，但是工具提示没有起作用

<a href="#" data-original-tittle="test" 
            data-placement="right"
            rel="tooltip"
            target=" _blank"> hover me 
</a>

或者我需要使用jQuery吗？

- M.R

---

你是否也包含了JS和CSS..？ - GautamD31

为什么到处都有空格？ - tbleckert

我使用这个例子链接。 - M.R

不明白为什么这个问题被关闭为“未定义”。 - Andre Figueiredo

我看到"data-original-tittle"中的"title"拼错了，也许这就是你的问题所在。 - BeckyS

Answer 1

尝试添加类似的工具提示

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

或者您可以直接选择如下

$('a').tooltip();

或者尝试使用它

<a href="#" data-toggle="tooltip"
data-original-title="Tooltip on right">hover me</a>

你的脚本类似于

$(function() {
    $('a').tooltip({placement: 'right'});
});

我的终极小提琴终于在这里

- GautamD31

---

我正在使用基于id的选择器：$('#ur').tooltip(); - M.R

你的锚点标签没有正确设置ID吗？ - GautamD31

还要检查相关的CSS和JS文件是否已正确上传。 - GautamD31

请查看此jsfiddle。 - M.R

现在虽然工作了，但是工具提示仍然显示在屏幕左侧，并且没有任何背景颜色，只有文本。 - M.R

我的代码: <a href="www.example.com" data-placement="right" rel="tooltip" target="_blank" title="www.example.com">hover</a>，但提示工具仍位于左侧。 - M.R

Answer 2

使用以下方式使用jqueryselectors：

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

希望对你有所帮助。

- Freelancer

---

仍然无法获取工具提示。 - M.R