Jquery:如何隐藏或关闭所有打开的bootstrap工具提示

Question

这样我就会从验证函数中显示bootstrap工具提示.

var options = { html: true, placement: 'bottom', title: '<div class="tooltip-alert alert-danger" data-placement="bottom">' + message + '</div>' };
        $(inputElement).addClass('validation-error');
        inputElement.tooltip("destroy")
            .addClass("error")
            .tooltip(options);
inputElement.tooltip("show");

所以当许多工具提示打开时,如果我点击另一个按钮,那么工具提示仍然打开,这是不好的.那么告诉我如何在用户点击另一个按钮时隐藏或关闭所有打开的bootstarp工具提示？

Answer 1

当你打开100多个工具提示时,我相信你已经.tooltip为所有事情提供了课程.因此,您可以使用此简写来关闭所有工具提示:

$(".tooltip").tooltip("hide");

片段

$(function () {
  $('[data-toggle="tooltip"], .tooltip').tooltip();
  $('[data-toggle="tooltip"], .tooltip').tooltip("show");
  $("button").click(function () {
    $('[data-toggle="tooltip"], .tooltip').tooltip("hide");
  });
});

body {padding: 50px;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />
<a href="#" data-toggle="tooltip" title="Hooray!">Hover over me</a>
<a href="#" data-toggle="tooltip" title="Hooray!">Hover over me</a>
<a href="#" data-toggle="tooltip" title="Hooray!">Hover over me</a>
<br /><br />
<button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="left" title="Tooltip on left">Tooltip on left</button>

<button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="top" title="Tooltip on top">Tooltip on top</button>

<button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="bottom" title="Tooltip on bottom">Tooltip on bottom</button>

<button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="right" title="Tooltip on right">Tooltip on right</button>

<br />
<br /><br /><br />
<button>Hide All</button>

Answer 2

使用下面的代码隐藏所有工具提示。

$('[data-toggle="tooltip"]').tooltip('hide');

-救命 ：）