twitter-bootstrap 刷新元素以显示其新工具提示（在 jQuery/Javascript 中）
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/22064881/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Refresh an element so its new tooltip shows (in jQuery/Javascript)
提问by Weblurk
I have an html element which is using bootstrap tooltip to show a title when hovering over it. However, when you click this element I'm changing the tooltip, but the new tooltip isn't showing until I remove the mouse from it and re-hover over the element again.
我有一个 html 元素，它在悬停在它上面时使用引导工具提示来显示标题。但是，当您单击此元素时，我正在更改工具提示，但直到我从中移除鼠标并再次将鼠标悬停在该元素上后，才会显示新的工具提示。
I want the tooltip to be shown instantly when said button is clicked. How can I achieve this? Is there a way to "refresh", in lack of better words, an html element?
我希望在单击所述按钮时立即显示工具提示。我怎样才能做到这一点？有没有办法在缺乏更好的词的情况下“刷新”一个 html 元素？
回答by dreamweiver
try this way
试试这个方法
HTML CODE:
HTML代码：
<h3>
Sensors Permissions
<i class="icon-info-sign" data-toggle="tooltip" title="first tooltip" id='example'></i>
</h3>
JQUERY CODE:
查询代码：
$(document).ready(function () {
$('#example').tooltip();
$('#example').on('click', function () {
$(this).attr('data-original-title', 'changed tooltip');
$('#example').tooltip();
$(this).mouseover();
});
});
LIVE DEMO:
现场演示：
http://jsfiddle.net/dreamweiver/9z404crn/
http://jsfiddle.net/dreamweiver/9z404crn/
Note: Above logic works only with Bootstrap version 2.3.2and below, however the solution provided by @NabiK.A.Z's would work with latest version as well.
注意：上述逻辑仅适用于 Bootstrap 2.3.2及以下版本，但@NabiK.AZ 提供的解决方案也适用于最新版本。
Happy Coding:)
快乐编码:)
回答by Nabi K.A.Z.
You can use this code:
您可以使用此代码：
var newTooltip = 'Changed this tooltip!';
$('#example').attr('data-original-title', newTooltip).parent().find('.tooltip-inner').html(newTooltip);
I test it with bootstrap 3.3.4 here you can see it: http://jsfiddle.net/NabiKAZ/a4WwQ/1029/
我用 bootstrap 3.3.4 测试它在这里你可以看到它：http: //jsfiddle.net/NabiKAZ/a4WwQ/1029/
回答by Baqer Naqvi
in case you are looking to refresh the contents;
如果您想刷新内容；
$('#example').tooltipster('content', 'i am superman!');
回答by heymega
Sure you just have to change the tooltips text within the onclick event
当然你只需要在 onclick 事件中更改工具提示文本
$('.tooltip-inner').html("This is a test");
I've created a jsfiddle for you as a demonstration http://jsfiddle.net/a4WwQ/59/
我为你创建了一个 jsfiddle 作为演示http://jsfiddle.net/a4WwQ/59/
Currently it will change all visible tooltips text which isnt really a problem since you arent going to show more than one at at a time. That being said, you should consider modifying the code to point to the closest tooltip.
目前，它会更改所有可见的工具提示文本，这并不是真正的问题，因为您一次不会显示多个。话虽如此，您应该考虑修改代码以指向最近的工具提示。
hope it helps!
希望能帮助到你！
