twitter-bootstrap Jquery：如何隐藏或关闭所有打开的引导工具提示
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/34854273/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Jquery: How hide or close all open bootstrap tooltip
提问by Thomas
This way I am showing bootstrap tooltip from my validation function.
这样我就从我的验证函数中显示了引导工具提示。
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");
so when many tooltips is open and if i click on another button then tooltips are still open which is not good. so tell me how to hide or close all open bootstarp tooltips when user click on another button?
所以当许多工具提示打开时，如果我点击另一个按钮，工具提示仍然打开，这并不好。所以告诉我如何在用户单击另一个按钮时隐藏或关闭所有打开的 bootstarp 工具提示？
回答by Praveen Kumar Purushothaman
When you have 100s of tooltips open, I believe you have given .tooltipclass for everything. So, you can use this shorthand to close all the tooltips:
当您打开数百个工具提示时，我相信您已经.tooltip为所有内容提供了课程。因此，您可以使用此简写来关闭所有工具提示：
$(".tooltip").tooltip("hide");
Snippet
片段
$(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>回答by Help
Use the below code for hiding all tooltips.
使用以下代码隐藏所有工具提示。
$('[data-toggle="tooltip"]').tooltip('hide');
-Help :)
-帮助 ：）
回答by Thomas
i have done the job this way....just iterate in table.
我以这种方式完成了这项工作......只需在表中迭代。
function HideToolTips() {
$('#StudentGrid tbody > tr').each(function (i, row) {
$(this).find("input[id*='FirstName']").tooltip('hide');
$(this).find("input[id*='LastName']").tooltip('hide');
$(this).find("select[id*='cboState'] :selected").tooltip('hide');
$(this).find("select[id*='cboCity'] :selected").tooltip('hide');
});
}
回答by Евгений К
My sollution is
我的解决方案是
$(".ui-tooltip").css('display','none');
