javascript - 刷新元素以显示其新工具提示(在 jQuery/Javascript 中)

Question

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

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

Answer 1

试试这个

演示:

http://jsfiddle.net/dreamweiver/9z404crn/

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

h3 {
  margin-top: 50px;
}

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

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link href="https://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/css/bootstrap-combined.min.css" rel="stylesheet" />
<script src="https://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/js/bootstrap.min.js"></script>

注意:

以上逻辑仅适用于 Bootstrap 版本 2.3.2 及以下，然而，@NabiK.A.Z 提供的解决方案的将适用于最新版本的 Bootstrap 库。

快乐编码:)