Javascript bootstrap 3 popover在最新版本的bootstrap（3.3.5）中未按预期工作
当用户单击页面上除popover之外的任何位置时，我试图取消Bootstrap3Popover。我发现了一个非常好的示例，并使用最新版本的Bootstrap3（3.3.5）将其添加到一个普通html文件中 在JSFIDLE示例中，由于使用的是引导版本3.0.2，所以一切正常 在我的应用程序中会发生以下情况： 我点击按钮显示弹出框，然后在弹出框外点击将其关闭。但是，当我再次单击按钮显示popover时，popover没有打开。如果我单击按钮再次显示弹出窗口，它将打开 下面是html文件中的所有内容Javascript bootstrap 3 popover在最新版本的bootstrap（3.3.5）中未按预期工作,javascript,asp.net,twitter-bootstrap,twitter-bootstrap-3,Javascript,Asp.net,Twitter Bootstrap,Twitter Bootstrap 3,当用户单击页面上除popover之外的任何位置时，我试图取消Bootstrap3Popover。我发现了一个非常好的示例，并使用最新版本的Bootstrap3（3.3.5）将其添加到一个普通html文件中 在JSFIDLE示例中，由于使用的是引导版本3.0.2，所以一切正常 在我的应用程序中会发生以下情况： 我点击按钮显示弹出框，然后在弹出框外点击将其关闭。但是，当我再次单击按钮显示popover时，popover没有打开。如果我单击按钮再次显示弹出窗口，它将打开 下面是html文件中的所有内容
<!DOCTYPE html>
<html>
<head>
<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<title></title>
</head>
<body>
<br/>
<br/>
<br/>
<br/>
<br/>
<div class="bs-example tooltip-demo">
<div class="bs-example-tooltips">
<button type="button" class="btn btn-default" data-container="body" data-toggle="popover" data-placement="top" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus." data-original-title="" title="">Popover on top</button>
<br/>
<br/>
<br/>
<br/>
<br/>
<button type="button" class="btn btn-default" data-container="body" data-toggle="popover" data-placement="bottom" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus." data-original-title="" title="">Popover on bottom</button>
<br/>
<br/>
<br/>
<br/>
<br/>
<button type="button" class="btn btn-default" data-container="body" data-toggle="popover" data-placement="right" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus." data-original-title="" title="">Popover on right</button>
</div>
</div>
<script type="text/javascript">
$('[data-toggle="popover"]').popover();
$('body').on('click', function (e) {
$('[data-toggle="popover"]').each(function () {
//the 'is' for buttons that trigger popups
//the 'has' for icons within a button that triggers a popup
if (!$(this).is(e.target) && $(this).has(e.target).length === 0 && $('.popover').has(e.target).length === 0) {
$(this).popover('hide');
}
});
});
</script>
</body>
</html>
上面的爆米花
底上的府绸
右边的爆米花
$（'[data toggle=“popover”]'）。popover（）；
$（'body'）。在（'click'，函数（e）上{
$（'[data toggle=“popover”]'）。每个（函数（）{
//“是”用于触发弹出窗口的按钮
//按钮内图标的“has”用于触发弹出窗口
如果（！$（this）.is（e.target）&&&$（this）.has（e.target）.length==0&&$（'.popover'）。has（e.target）.length==0）{
$（this.popover（'hide'）；
}
});
});