14

我正在使用 Twitter Bootstrap 包中的工具提示在页面上显示项目信息。有时信息会发生变化，需要在工具提示中更新。我试图简单地用新标题重新初始化工具提示：

$('#selector').tooltip({ title: 'new text'});

但是，工具提示的标题不会随新文本而改变。它与最初设置的一样。任何想法为什么，有什么解决方法吗？谢谢！

4

6 回答 6

17

一旦你在一个元素上初始化了工具提示对象，你就不能覆盖它。但是你可以删除它然后再做一次。

尝试删除，然后使用所有选项（如果有的话）重新初始化工具提示。

$('#selector').data('bs.tooltip',false)          // Delete the tooltip
              .tooltip({ title: 'new text'});

可能需要删除侦听器，但它是这样工作的。

在 TWBS v3 之前，您不需要bs命名空间：data('tooltip')

于 2012-06-26T19:32:52.900 回答
8

这种技术对我不起作用，所以我找到了一个答案，隐藏在一个类似问题的评论中。

更新工具提示显示文本的最简洁方法

$(element).attr('title', 'NEW_TITLE').tooltip('fixTitle').tooltip('show');

感谢lukmdo

于 2015-06-12T12:50:28.413 回答
3

我使用 bootstrap 3，没有错误，这些都对我有用。通过销毁工具提示.tooltip('destroy')并在同一函数中重新创建它.tooltip({...})会导致工具提示不再工作。它仅在稍后完成重新调用时才有效，在销毁调用完成后异步工作（因此立即重新创建被破坏了）。

销毁内部数据的建议.data('tooltip',false)没有奏效。首先，使用 bootstrap 3，data('bs.tooltip, false)当它被调用时，如果当前显示工具提示，它会泄漏它并使其永久显示。新的工具提示将显示和隐藏在它上面。

我的最终解决方案是：

$x.tooltip('hide');
$x.data('bs.tooltip', false);
$x.tooltip({ ... }) // recreate it

请注意，通过.attr('title', '...')类似的解决方案和调用也可以更改标题.tooltip('fixupTitle')- 但丢弃了该placement选项以及可能还有其他选项，并制作了一个工具提示，该工具提示放置在元素顶部而不是像原来那样放在右侧。它甚至可能有上面列出的一些其他错误，在这个解决方案的其他变体中可以看到，但我没有进一步研究。

于 2017-10-12T01:33:40.107 回答
2

出于某种原因，这对我不起作用（引导程序 2.1.1）。我必须做的是：

    $('#element').tooltip('destroy');
    $("#element").tooltip({'placement':'right', 'title':'larger larger text title'});
    $("#element").tooltip('show');
于 2014-08-17T08:02:57.077 回答
0

@Sherbrow您可以使用最简单的。不需要这个复杂的解决方案。这是示例代码。

$('#spanUsername').prop('title', newValue);
于 2017-01-04T07:49:44.747 回答
0

这适用于引导程序 3，高于此线程中给出的所有其他解决方案：

$('#tooltip_selector').attr('data-original-title', 'New Title Here');
于 2019-02-03T20:23:16.943 回答