模态打开时如何隐藏弹出框答案

【问题标题】：How to hide popover when modal open模态打开时如何隐藏弹出框
【发布时间】：2018-01-01 15:24:05
【问题描述】：

假设我有一个包含 links <a> 的弹出框，其中一些链接可以打开 modal。

问题在于，当模式打开时，此弹出框仍然处于活动状态。当任何模式显示在单击此弹出框内的这些链接后，如何隐藏所有活动的弹出框？

<div class="popover-content">
<ul class="popover-ul">
    <li>
      <a href="#" data-msg="<h4>OUT</h4><img src='yourlinkhere' alt='OUT'>" data-toggle="modal" data-target="#doc-modal" data-ok="data-ok">
      OUT
      </a>
    </li>
</ul>

【问题讨论】：

标签： javascript modal-dialog bootstrap-modal popover bootstrap-popover

【解决方案1】：

我相信我理解您的问题集不可见：隐藏弹出框（任何），fiddle

var _pops = document.getElementsByClassName("popover-content");
console.log(_pops)
for(var i=0; i<_pops.length;i++){
_pops[i].style.visibility = "hidden"
}

【讨论】：

我的问题是，当我按下同一个弹出框内的任何链接时，它会显示一个模式，并且此弹出框仍然处于活动状态，我需要在按下其中的链接时隐藏此弹出框

【解决方案2】：

您可以使用popover hide功能来隐藏popover。

工作示例：http://jsfiddle.net/qy9Az/3414/

$('.test').popover('hide')

我认为这会有所帮助

$('body').on('shown.bs.modal', function() {
     $("[data-toggle=popover]").popover('hide')
});

其中 test 是附加弹出框的元素的类

详情请见https://v4-alpha.getbootstrap.com/components/popovers/#popoverhide

【讨论】：

感谢您的回答，我希望您批准所做的编辑以适合该问题！

【解决方案3】：

我认为这会有所帮助

$('body').on('shown.bs.modal', function() {
     $("[data-toggle=popover]").popover('hide')
});

【讨论】：