Question

我为工具提示设置了以下代码：

<div class="myClass" data-toggle="tooltip" data-placement="bottom"
data-delay='{"show":"500"}' rel="tooltip" title="My Text"> <a 
id="myId" target="_blank" 
href="#"><img class="anotherClass" src="somelogo.png" />
<div class="viewText">View</div></a>
</div>

当我点击这个div时，我会被重定向到另一个页面（target =＆＃34; _blank＆＃34;），但是当我回到我的页面时，工具提示就在那里（可能是因为悬停工具提示的事件仍然存在。我想..）并且在我手动点击页面上的某个地方之前不会被销毁！

我希望工具提示消失，只有在用户再次徘徊时才会显示。我该如何实现？请帮忙。我正在使用Bootstrap 3，Javascript，Jquery 1.10和CSS3。

谢谢！

Answer 1

它是bootstrap.min.js中的默认功能

c.VERSION = "3.3.7", c.TRANSITION_DURATION = 150, c.DEFAULTS = {
    animation: !0,
    placement: "top",
    selector: !1,
    template: '<div class="tooltip" role="tooltip"><div class="tooltip-arrow"></div><div class="tooltip-inner"></div></div>',
    trigger: "hover focus",
    title: "",
    delay: 0,
    html: !1,
    container: !1,
    viewport: {
        selector: "body",
        padding: 0
    }
}

从触发器中移除“焦点”：“悬停焦点”

这解决了我的问题。

Answer 2

$('[data-toggle="tooltip"]').tooltip({
    trigger : 'hover'
});

这解决了我的问题。

Bootstrap Tooltip不会被破坏

2 个答案: