刷新元素，使其新的工具提示显示（在jQuery/Javascript中）

我有一个html元素，当鼠标悬停在它上面时，它使用引导工具提示来显示标题。但是，当您单击此元素时，我将更改工具提示，但新工具提示不会显示，直到我将鼠标从中移除并再次将鼠标悬停在该元素上

---

我希望工具提示在所说的按钮被点击时立即显示。我怎样才能做到这一点？在缺少更好的单词时，有没有办法“刷新”html元素？

确定只需更改onclick事件中的工具提示文本即可

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

我为您创建了一个JSFIDLE作为演示

目前，它将更改所有可见的工具提示文本，这并不是一个真正的问题，因为您不会一次显示多个工具提示。也就是说，您应该考虑修改代码以指向最接近的工具提示。< /P> 希望有帮助

这样试试

HTML代码：

 <h3>
Sensors Permissions
   <i class="icon-info-sign" data-toggle="tooltip" title="first tooltip" id='example'></i>
 </h3>

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

现场演示：

 <h3>
Sensors Permissions
   <i class="icon-info-sign" data-toggle="tooltip" title="first tooltip" id='example'></i>
 </h3>

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

注：上述逻辑仅适用于引导版本2.3.2及以下版本，但@NabiK.A.Z提供的解决方案适用于最新版本的引导库

快乐编码：）

您可以使用以下代码：

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

---

我使用Bootstrap3.3.4测试它，您可以在这里看到它：

如果您希望刷新内容

$('#example').tooltipster('content', 'i am superman!');

---

对我来说，在bootstrap 4中，这起到了作用：

$("#xxx").tooltip("dispose").attr("title", "New Tooltip").tooltip()

---

如果你发布代码会有帮助。我不确定引导中是否有任何“刷新”事件，但解决方法是在单击事件回调结束时内部调用“鼠标悬停”事件。很好，这正是我想要的。所以我错过了mouseover（）。谢谢@Web潜伏者：快乐编码：）不要使用Bootstrap 3.3.0+，你可以在这里尝试测试失败：我建议使用此解决方案：@NabiK.A.Z:有趣的是，看起来在Bootstrap 3.3.0+版本中工具提示的实现方式发生了重大变化，因为这是一种黑客行为，而不是Bootstrap的真正解决方案，他们从不费心在新版本的bootstrap（即从3.0+开始）中维护相同的逻辑。无论如何，很高兴知道这一点。正如你所说，如果页面中有两个工具提示，那么你的解决方案就不起作用了。我认为这个解决方案更好：同意-我已经更新了你的JSFIDLE，因为当鼠标悬停在JSFIDLE上时，所有的工具提示都会显示出来。