Question

我试图隐藏模式，但是模式消失了，背景一直保持不变，不允许我单击任何东西。我必须刷新整个页面才能工作

这是我的代码：

   $("#AddNewOrganizationModal").modal('hide');

这似乎可以在我所有其他模式中使用，但我无法指出为什么不关闭该模式：

这是仍在显示的课程：

   .modal-backdrop {
     position: fixed;
     top: 0;
     right: 0;
     bottom: 0;
     left: 0;
     z-index: 1040;
     background-color: #1a1a1a;
   }

有没有一种方法可以删除这个类？

仅当我在开发网站上时，这种情况才会发生。在本地它可以正常工作，并且可以关闭，没有任何问题。

在azure dev ops上可以缓存一些东西吗？

Answer 1

Bootstrap模态的构造方式，背景是模态容器的一部分。

这里有一些伪代码来说明我的意思：

<modal-wrapper>
  <modal-backdrop>
    <modal-container>
      content of modal
    </modal-container>
  </modal-backdrop>
</modal-wrapper>

您要对其应用隐藏功能的元素是<modal-wrapper>。当您将其隐藏时，<modal-backdrop>也将被隐藏。

您可能正在隐藏<modal-container>，因此<modal-backdrop>仍然显示。

Answer 2

我遇到了同样的问题，不得不在模式隐藏事件期间手动强制隐藏背景。类似于以下代码：

 $('#myModal').on('hidden.bs.modal', function (e) {
    $('.modal-backdrop').hide();
 });

Answer 3

这最终就是答案：

           $('.modal-backdrop').fadeOut(150);

调用.hide（）

3 个答案: