Jquery 如果第二个模态打开，则在覆盖后隐藏第一个模态

我有一个模态，它包含一个触发第二模态的按钮。问题是第二个模态的叠加并没有先隐藏。它只会使背景更暗。我怎样才能使第二个模态的叠加隐藏第一个模态

代码

---

演示

打开第二个模式时，只需隐藏第一个模式即可

以下是修改后的JSFIDLE：

---

这就是你的意思吗？

我有这个jquery解决方案。如果有人有任何css解决方案，请建议我

$('#myModal2').on('show.bs.modal', function() {  
    $('.modal').not(this).addClass('opac');
});

$('#myModal2').on('hide.bs.modal', function () {
     $('.modal').not(this).removeClass('opac');
})

---

您应该区分第一个背景和第二个背景，因此第一个背景的z-指数低于第一个模态，第二个背景的z-指数高于第一个模态但低于第二个模态。

不想隐藏模态不想自举分配一个类或任何东西来区分叠加是特定模态的。它只是一个简单的例子：请参考。

<a href="#myModal2" role="button" class="btn" data-toggle="modal" data-dismiss="modal">Launch Second Modal</a>

$('#myModal2').on('show.bs.modal', function() {  
    $('.modal').not(this).addClass('opac');
});

$('#myModal2').on('hide.bs.modal', function () {
     $('.modal').not(this).removeClass('opac');
})