jQuery 工具工具提示 - 更改标题

Question

jquery 插件工具提示出现问题 (http://flowplayer.org/tools/tooltip/index.html) 我需要更改元素的标题..

   reloadTooltip();
   $("#example").attr('title', obj.text);
   reloadTooltip();

   function reloadTooltip(){
       $("[title]").tooltip({ position: "bottom right", opacity: 1 });
   }

Html 部分：

   <span title="text" id="example"></span>

通过我的解决方案，我终于得到了 2 个标题，一个在另一个之上。无样式（忽略 js）是新的。工具工具提示标题尚未更改。

谢谢

Answer 1

这对我有用：

$('#yourID').attr('data-original-title', 'New Message').tooltip('show').tooltip('hide');

Answer 2

动态更改标题的另一种解决方案是使用 onBeforeShow 事件：

jQuery('#myselector').tooltip({onBeforeShow: tooltipBeforeShow});

...

function tooltipBeforeShow() {
  // On production you evaluate a condition to show the apropiate text
  var text = 'My new text for the <b>tooltip</b>';
  this.getTip().html(text);
}

this 引用事件函数上的工具提示对象

Answer 3

除了重新初始化工具提示之外，没有什么对我有用：

        //Save the current configuration.
        var conf = trigger.data('tooltip').getConf();
        trigger.removeData('tooltip').unbind();
        //Add the changed text.
        var newText = 'Hello World!';
        trigger.attr("title", newText);
        //Reapply the configuration.
        trigger.tooltip(conf);

之前涉及 getTip() 的答案要求工具提示至少显示一次；否则，getTip() 会产生 null。

使用 OnBeforeShow 几乎对我有用，但我不知道如何取消绑定事件，以便它不会在每次显示时执行。

由于某种原因，更改标题对我来说不起作用，可能是因为我使用的是自定义布局。

Answer 4

尝试通过调用 jQuery 的 data("title") 方法来修改标题值。

Answer 5

我也为此苦苦挣扎。这段代码对我有用：

$('.yourelement').attr('tooltipText', newToolTip);

请注意大写的 T。小写的 T 不起作用。

Answer 6

对我来说最好的工具提示！此工具提示类似于 Gmail

位于头站点：

<script type='text/javascript' src='//code.jquery.com/jquery-1.9.1.js'></script>
<script type='text/javascript' src="http://onehackoranother.com/projects/jquery/tipsy/javascripts/jquery.tipsy.js"></script>
<link rel="stylesheet" type="text/css" href="http://onehackoranother.com/projects/jquery/tipsy/stylesheets/tipsy.css">

在 HTML 上：

<a class="example" href="#" original-title="Hello World">Hover over me</a>

<br/>

<a class="example" href="#" original-title="Hello World">Hover over me</a>

<br/>

<a class="example" href="#" original-title="Hello World">Hover over me</a>

在 Javascript 代码上：

$(function() {
    $('.example').tipsy();
});

访问演示 jsfiddle

Answer 7

以上所有方法均不适用于最新版本的tooltipster，正确的方法是：

$('#help').data($('#help').data('tooltipsterNs')[0]).Content="new content";

Answer 8

知道了 ！
根据最近版本的工具提示（从 v2.3.1 开始）https://github .com/twitter/bootstrap/blob/master/js/bootstrap-tooltip.js#L272
您需要设置属性（而不是属性）“data-original-title”，因为这是工具提示当前正在使用的属性。

这是一个黑客，但我希望它对你有用，就像对我有用一样。

$('#example').attr('data-original-title','the new text you want'); //and that's it.

Answer 9

我也要做同样的事情。我查看了工具提示插件代码，发现了更新工具提示的快速且简单的方法。该插件删除标题属性并将该内容放入名为 tooltipText 的元素属性中。在 jQuery 1.6+ 中，可以像这样操作：

// get the current tooltip content
$('#someElement').prop('tooltipText')

// set the tooltip content
$('#someElement').prop('tooltipText', 'w00t');

该插件在 1.3 版本中的第 55 行设置了 tooltipText 属性（注意大写）。据我所知，以这种方式完成的更改是即时的。

如果进行直接元素操作，工具提示内容位于：

var e = document.getElementById('#someElement');
alert(e.tooltipText);
e.tooltipText = 'w00t';

Answer 10

不知道你是否还在寻找这个问题的答案，但我刚刚花了几个小时尝试对同样的事情进行排序，并在 API 中找到了答案（一旦你找到它们，它们总是很简单！）文档。

无论您首先在哪个元素上设置工具提示，都可以从中获取工具提示 API 并设置新值。即，如果您在 id 为“myTip”的元素上设置工具提示

$('#myTip').data('tooltip').getTip().html("New string!") ;

，瞧。

您不需要删除标题（并且无论如何也不应该删除，因为工具提示是延迟初始化的）。而是使用 cancelDefault 配置：

http://flowplayer.org/tools/tooltip/index.html

Answer 11

所有其他选项在最新版本的 tooltipster (3.3.0) 上均不起作用
我发现这个命令有效：

$('#selectorElement').tooltipster('content', 'new title');

Answer 12

这个怎么样？

   initTooltip();
   updateTooltip(obj.text);


   function initTooltip(){
       $("[title]").tooltip({ position: "bottom right", opacity: 1 });
   }

   function updateTooltip(text){
       $("[title]").attr('title', text);
       $("[title]").data('title',text);
       $("[title]").removeAttr("title");   
    }

我不知道这是否是最好的方法，但我认为它可能适合您。

---

obj.text 正确吗？ obj.text 中有什么？