Question

我正在使用bootbox，我的模态上有一个按钮，当点击它时，它会打开另一个模态。问题是当打开新模态时，它背后的模态不会变暗。相反，两个模态背后的背景变得更暗。我该怎么做才能解决它？

以下是我的示例代码：

        $('#new-btn').click(function () {
        new_room_form = bootbox.dialog({
            title: "New room",
            message: 
                '<div class="row">' +
                    '<div class="col-md-12">' +
                    '<form>' +
                        '<fieldset style="padding: 20px">' +
                            '<legend>Example:</legend>' +
                            '<div class="form-group">' +
                                '<button class="btn btn-primary" id="add">Add</button>' +
                            '</div>' +

                        '</fieldset>' +
                    '</form>' +
                '</div>' +
            '</div>',
            buttons: {
                cancel: {
                    label: "Cancel",
                    className: "btn btn-default"
                },
                add: {
                    label: "Add",
                    className: "btn btn-primary",
                }

            }
    }); // end bootbox dialog      

     $('#add').on('click', function(response) {
            bootbox.alert("Hello world!", function() {
            });
             return false;
        }); 
    });

Answer 1

Bootbox主要是一个包装器/辅助库，旨在使Bootstrap模块更易于使用。因此，它具有Bootstrap的所有限制，包括：

不支持多个打开模式

请确保不打开模态，而另一个模态仍然可见。显示   一次有多个模态需要自定义代码。

http://getbootstrap.com/javascript/#modals

简而言之，您必须自己处理。您所看到的可能是绝对定位和叠加的z-index值相同的结果。

目前，我不知道Bootbox或Bootstrap中的任何内容可以让你直接操作模态的背景。您获得的最接近的选项是禁用背景，您可以通过将backdrop: false作为其中一个选项进行传递。

在另一个模态顶部打开一个bootbox模态不会使模式在后面变暗

1 个答案:

不支持多个打开模式