Jquery 引导盒警报显示在右上角

您好，我正在尝试使用bootbox alert向用户显示json响应中返回的数据。但是，模式窗口在屏幕的右上角弹出，而不是居中。有什么帮助吗？ 请不要告诉我，我的母版页引用了jquery和bootstrap

    <script src="~/Scripts/jquery.validate.min.js"></script>
    <script src="~/Scripts/jquery.validate.unobtrusive.min.js"></script>
    <script src="~/Scripts/DataTables/jquery.dataTables.min.js"></script>
    <script src="~/Scripts/DataTables/dataTables.bootstrap.min.js"></script>
    <script src="~/Scripts/bootbox.min.js"></script>

    <script>
        $(document).ready(function () {
            $('.page-wrapper').css("background-color", "");
            $("#divProcessing").hide();

            $('form').on('submit', function (e) {
                e.preventDefault();

                $('body .page-wrapper').css("background-color", "rgba(0,0,0,0.5)");
                $("#divProcessing").show();

                $.ajax({
                    url: "/BulkEmail/UploadEmailList",
                    type: this.method,
                    data: new FormData(this),
                    cache: false,
                    contentType: false,
                    processData: false,
                    success: function (data) {
                        if (data.isValid) {
                            bootbox.alert(data.error);
                        }
                        else
                        {

                            bootbox.alert('It worked');
                        }
                        $('body .page-wrapper').css("background-color", "");
                        $("#divProcessing").hide();

                    },
                    error: function (xhr, error, status) {
                        $('body .page-wrapper').css("background-color", "");
                        $("#divProcessing").hide();
                        bootbox.alert(status);
                        console.log(error, status);
                    }
                });
            });
        });
    </script>

---

这是你的问题的一个特定解决方案，这可能会对你有所帮助

bootbox.alert('It worked').find('.modal-dialog').css('margin', 'auto');

---

这可能是由于.page wrapper中的样式造成的。检查css以了解这一点。我变换模态，使它们直接位于屏幕中央。默认情况下，它们应从顶部居中显示。如果要将它们置于屏幕中央，请尝试以下操作：

      .modal{

       top: 50%;
       bottom: 50%;
       transform: translate(-50%, -50%);
       position: absolute;
       z-index: 1040;

     }

---

只需在样式表中添加以下CSS样式规则

.modal-dialog {
        left: auto;
    }

---

谢谢，但是我仍然对屏幕右上角弹出的引导框警报对话框有问题。正常的引导模式显示正确吗？Bootbox没有自己的任何样式，所以我假设您的CSS中有一些与Bootstrap不兼容的规则集。了解您正在使用哪个版本的引导也会很有帮助。