Question

快速提问（希望如此？）。我有一个模态（单击按钮，弹出的东西/内容） - 在模态中我有文本，我想让某人点击它，它会在前面打开另一个模态。

初始模式是：

<button class="btn btn-two shortcode-popup-trigger" data-toggle="modal" data-target="#modal-group-5">MORE INFO</button>

然后在里面我使用了完全相同的行但是将模态ID改为我想要打开的另一个模态。这是有效的，除了新模态打开当前的模式。有人能帮我这个吗？我很感激！

Answer 1

它是相同的模态模块，因此猜测.modal的z-index对于两个模态都是相同的。为什么不为每个模态尝试不同的z-index es？

#modal-group-4 {
    z-index: 400;
}

#modal-group-5 {
    z-index: 500;
}

如果这不起作用。然后你可以尝试关闭第一个模态，然后在第二个模态关闭时显示它。像这样的东西，

关闭第一个模态：

<button class="btn btn-two shortcode-popup-trigger" data-toggle="modal" data-target="#modal-group-5" onclick="jQuery('#modal-group-4').modal('toggle');">MORE INFO</button>

要重新打开第一个模态，我们需要监听第二个模态的结束事件，

$('#modal-group-5').on('hidden.bs.modal', function () {
    jQuery('#modal-group-4').modal('toggle');
})

注意：仅在Bootstrap 3中支持上述方法。对于较低版本，请使用此

$('#modal-group-5').on('hidden', function () {
    jQuery('#modal-group-4').modal('toggle');
})

Method # 2 Source

Answer 2

在“ HTML”页面中，确保“ modal-group-4”模态位于“ modal-group-5”上方。如果您的modal-group-5高于modal-4，那么modal-group-5就会落后于modal-group-4。

尝试一下。

在另一个面前打开模态

2 个答案: