刷新一个元素,使其新的工具提示显示(在jQuery / Javascript中)

我有一个html元素,它使用bootstrap工具提示在鼠标hover时显示标题。 但是,当您单击此元素时,我正在更改工具提示,但是直到我从中移除鼠标并再次将鼠标hover在元素上之后,新的工具提示才会显示。

我希望在单击所述按钮时立即显示工具提示。 我怎样才能做到这一点? 有没有办法“刷新”,缺乏更好的单词,一个HTML元素?

试试这种方式

HTML代码:

  

Sensors Permissions

JQUERY CODE:

 $(document).ready(function () { $('#example').tooltip(); $('#example').on('click', function () { $(this).attr('data-original-title', 'changed tooltip'); $('#example').tooltip(); $(this).mouseover(); }); }); 

现场演示:

http://jsfiddle.net/dreamweiver/9z404crn/

注意:以上逻辑仅适用于Bootstrap版本2.3.2及更低版本,但@ NabiK.AZ提供的解决方案也适用于最新版本。

快乐编码:)

您可以使用此代码:

 var newTooltip = 'Changed this tooltip!'; $('#example').attr('data-original-title', newTooltip).parent().find('.tooltip-inner').html(newTooltip); 

我用bootstrap 3.3.4测试它,你可以看到它: http : //jsfiddle.net/NabiKAZ/a4WwQ/1029/

当然,您只需要在onclick事件中更改工具提示文本

 $('.tooltip-inner').html("This is a test"); 

我为你创建了一个jsfiddle作为演示http://jsfiddle.net/a4WwQ/59/

目前它将更改所有可见的工具提示文本,这不是一个真正的问题,因为你不会一次显示多个。 话虽这么说,您应该考虑修改代码以指向最接近的工具提示。

希望能帮助到你!