点击更改Twitter引导工具提示内容
我有一个锚点元素的工具提示，点击发送一个AJAX请求。 这个元素有一个工具提示（来自Twitter Bootstrap）。 我希望工具提示内容在AJAX请求成功返回时更改。 启动后如何操作工具提示？
刚刚在阅读源代码的时候发现了这个。 所以$.tooltip(string)调用Tooltip类中的任何函数。 如果您查看Tooltip.fixTitle ，它将获取data-original-title属性并用它replace标题值。
所以我们只是做：
$(element).tooltip('hide') .attr('data-original-title', newValue) .tooltip('fixTitle') .tooltip('show');
当然，它会更新标题，这是工具提示中的值。
另一种方式（请参阅下面的@lukmdo评论）：
$(element).attr('title', 'NEW_TITLE') .tooltip('fixTitle') .tooltip('show');
在Bootstrap 3中，调用elt.attr('data-original-title', "Foo")就足够了elt.attr('data-original-title', "Foo")因为"data-original-title"属性中的更改已经触发了工具提示显示中的更改。
inheritance人一个很好的解决scheme，如果你想改变文本没有closures并重新打开工具提示。
$(element).attr('title', newTitle) .tooltip('fixTitle') .data('bs.tooltip') .$tip.find('.tooltip-inner') .text(newTitle)
这样，文字replace而不closures工具提示（不重新定位，但如果你正在做一个字改变等应该没问题）。 当你将鼠标hover在工具提示上时，它仍然被更新。
**这是bootstrap 3，对于2，你可能不得不改变数据/类名称
您可以更新工具提示文本，而无需实际调用show / hide：
$(myEl) .attr('title', newTitle) .tooltip('fixTitle') .tooltip('setContent')
这工作如果工具提示已经实例化（可能与JavaScript）：
$("#tooltip_id").data('tooltip').options.title="New_value!"; $("#tooltip_id").tooltip('hide').tooltip('show');
下面的工作对我来说是最好的，基本上我废除了任何现有的工具提示，而不是打扰显示新的工具提示。 如果在其他答案中调用工具提示上的显示，则即使光标不在其上方hover，也会popup。
我去这个解决scheme的原因是，其他解决scheme，重新使用现有的工具提示，导致一些奇怪的问题与工具提示有时不显示时，hover在元素上方的光标。
function updateTooltip(element, tooltip) { if (element.data('tooltip') != null) { element.tooltip('hide'); element.removeData('tooltip'); } element.tooltip({ title: tooltip }); }
对于bootstrap 3.x
这似乎是最干净的解决scheme：
$(element) .attr('data-original-title', 'New title').tooltip('show')
显示用于立即更新标题，而不是等待工具提示被隐藏并再次显示。
感谢这个代码对我非常有帮助，我发现它对我的项目有效
$(element).attr('title', 'message').tooltip('fixTitle').tooltip('show');
销毁任何预先存在的工具提示，以便我们可以重新填充新的工具提示内容
$(element).tooltip("destroy"); $(element).tooltip({ title: message });
你可以使用：$（element）.attr（'data-original-title'，newValue）;
您可以使用function在工具提示调用上设置内容
$("#myelement").tooltip({ "title": function() { return "<h2>"+$("#tooltipcontainer").html()+"</h2>"; } });
您不必只使用被调用元素的标题。
我认为穆罕默德杜兰几乎是正确的，但使用相同的工具提示和他们的位置多个类时，有一些问题。 下面的代码也避免了js错误检查，如果有任何类称为“tooltip_class”。 希望这可以帮助。
if (jQuery(".tooltip_class")[0]){ jQuery('.tooltip_class') .attr('title', 'New Title.') .attr('data-placement', 'right') .tooltip('fixTitle') .tooltip('hide'); }
通过直接更改元素中的文本来更改文本。 （不更新工具提示位置）。
$('.tooltip-inner', $element.next()).html(newHtml); $('.tooltip-inner', $element.next()).text(newText);
通过销毁旧的工具提示来更改文本，然后创build并显示一个新的工具提示。 （导致旧的淡出和新的淡入）
$element .tooltip('destroy') .tooltip({ // Repeat previous options. title: newText, }) .tooltip('show');
我正在使用顶部方法来为“保存”添加animation。 消息（使用 所以工具提示大小不变）并将文本更改为“完成”。 （加上填充），当请求完成。
$element.tooltip({ placement: 'left', title: 'Saving...', trigger: 'manual', }).tooltip('show'); var parent = $element.parent(); var interval_id = setInterval(function(){ var text = $('.tooltip-inner', parent).html(); switch(text) { case 'Saving. ': text = 'Saving.. '; break; case 'Saving.. ': text = 'Saving...'; break; case 'Saving...': text = 'Saving. '; break; } $('.tooltip-inner', parent).html(text); }, 250); send_request( function(){ // When the request is complete clearInterval(interval_id); $('.tooltip-inner', parent).html('Done. '); setTimeout(function() { $element.tooltip('hide'); }, 1500 /* Show "Done." for a bit */); });
您可以使用此代码隐藏工具提示更改其标题，并再次显示工具提示，当ajax请求成功返回。
$(element).tooltip('hide'); $(element).attr('title','this is new title'); $(element).tooltip('fixTitle'); setTimeout(function() { $(element).tooltip('show');}, 500);
我无法得到任何答案的工作，这是一个解决方法：
$('#'+$(element).attr('aria-describedby')+' .tooltip-inner').html(newTitle);
这对我有效：（bootstrap 3.3.6; jquery = 1.11.3）
<a id="alertTooltip" href="#" data-html="true" class="tooltip" data-toggle="tooltip" title="Tooltip message"></a> <script> $('#alertTooltip').attr('title', "Tooltip new <br /> message").tooltip('fixTitle'); </script>
属性data-html="true"允许在工具提示标题上使用html。
