Bootstrap 第一次点击后需要双击的工具提示

Question

我遇到了一个问题，工具提示在单击一次后需要双击。例如，我单击 tooltip1，然后单击 tooltip2，然后再次单击 tooltip1。我第二次单击 tooltip1 时需要单击两次才能再次显示工具提示。

总的来说，我正在寻找的是一个包含 4 个工具提示的页面，当我单击 link 时将显示工具提示并且一次只显示一个工具提示，因此如果显示一个工具提示，则显示其他 3 个被隐藏了。

$(document).ready(function() {
$('[data-toggle="tooltip"]').tooltip();
});

$(document).on('show.bs.tooltip', function() {
$('.tooltip').not(this).hide();
});

Answer 1

我遇到了同样的问题。解决方法是检测应该关闭的显示事件上任何打开的工具提示，然后触发单击以关闭它们。

//init bootstrap tooltips
$('[data-toggle="tooltip"]').tooltip({
  trigger:'click'
});

//listen for the show event on any triggered elements
$('[data-toggle="tooltip"]').on('show.bs.tooltip', function() {

 //get a reference to the current element that is showing the tooltip
  var triggeredElement = $(this);

  //loop through all tooltips elements
  $('[data-toggle="tooltip"]').each(function(){

    //if they are not the currently triggered element and have a tooltip, 
    //trigger a click to close them
    if($(this) !== triggeredElement && $(this).next().hasClass('tooltip')) {
      $(this).click();
    }
  })
});

Bootstrap 第一次点击后需要双击的工具提示

Bootstrap tooltip requiring double click after first click

javascript

tooltip

twitter-bootstrap