在单击链接之前，如何使引导工具提示保持可见 [英] How to make bootstrap tooltip remain visible till the link is clicked

问题描述

我有一个链接，当用户有一些新通知时，我将使用该链接作为通知，我将通过显示工具提示(Twitter Bootstrap工具提示)来通知用户.我要实现的是，该工具提示应该保持可见，直到用户单击链接为止.用户单击链接后，工具提示应销毁.这是我到目前为止所拥有的， http://jsfiddle.net/testtracker/QsYPv/

I have a link which I am going to use as notification when a user has some new notification I am going to notify the user by showing a tooltip(twitter bootstrap tooltip). What I want to achieve is, that tooltip should remain visible till the user clicks the link. once the user clicks the link, the tooltip should destroy. this is what I have till now, http://jsfiddle.net/testtracker/QsYPv/

HTML

<p><a href="#" rel="tooltip" data-original-title="you have 2 notifications">Notification</a>.</p>​

JavaScript

JavaScript

$('p a').tooltip({placement: 'bottom'}).tooltip('show');​

发生了什么事，工具提示一直保持可见状态，直到您将其悬停为止；一旦将其悬停，它就会采用其默认行为(在悬停时显示).

What's happening there is, tooltip stays visible till you hover it, and takes its default behaviour (show on hover) once you hover it.

我希望我已经提供了正确的信息并清除了我想做的事情.

I hope I have given proper info and cleared what I want to do.

推荐答案

以下是解决方案 http://jsfiddle.net/testtracker/QsYPv/8/

添加了触发"选项

$('p a').tooltip({placement: 'bottom',trigger: 'manual'}).tooltip('show');

然后，在此行

$('p a').on('click',function(){$(this).tooltip('destroy');});

点击

破坏工具提示.

destroy tooltip on click.

这篇关于在单击链接之前，如何使引导工具提示保持可见的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！