Question

当我显示一个模态，并且此模态中的动作显示另一个模态时，所有屏幕都会变得不透明，当然这很烦人。

我看到materialize在DOM的末尾创建了一个元素：

<div class="lean-overlay" id="materialize-lean-overlay-1" style="z-index: 1002; display: block;opacity: 0.5;"></div>
<div class="lean-overlay" id="materialize-lean-overlay-2" style="z-index: 1004; display: block;opacity: 0.5;"></div>

我应该将最后一个元素的不透明度设置为0。

但我认为这个解决方案并不适用于所有情况（有时候是id="materialize-lean-overlay-XXX"）。我可以循环所有class="lean-overlay"元素，并将最后一个元素的不透明度设置为0，但不确定它是否是最佳解决方案。

你怎么看？谢谢！

Answer 1

我几天前解决了这个问题，如果可以帮助某人，我会分享这些代码。打开第二个模态（删除确认模式）的功能是：

 _displayModalDelete: function() {
      $('#modalDelete').openModal();
      var length = $(".lean-overlay").length-1;
      $(".lean-overlay")[1].style.opacity="0";
      $(".lean-overlay")[1].style.zIndex="0";
  }

Answer 2

尝试删除父模态的无力并运行

Answer 3

让第二个模态元素与第一个模态处于同一级别，而不是在其中，应该可以帮助您避免这个问题，而无需处理css属性的麻烦。

实现css双模态

3 个答案: