将 jQuery 对话框与动态高度内容垂直居中放置

Position jQuery dialog centered vertically with dynamic height contents

本文关键字：垂直居中 高度 jQuery 对话框 动态      更新时间：2023-09-26

我正在使用一个jQuery对话框，其内容大小可变。 我使用 create 方法动态填充内容。 当对话框呈现时，对话框的左上角位于屏幕中央，但由于对话框很高，因此底部远离页面。 我希望它完美居中，无论对话框的大小如何。 这是jQuery：

var dialogOptions = {
    title: "",
    modal: true,
    width: 'auto',
    autoOpen: false,
    create: function () {
        $(this).load("/Management/RenderPartialCreateSubject");
    }
};
$("#dialog-message").dialog(dialogOptions);
$("#dialog-message").dialog("open");

我唯一能弄清楚的是，在定位对话框之前没有加载内容。 有什么方法可以让它事先加载内容吗？

我还尝试将部分视图直接加载到div 中，然后像这样打开对话框：

$.get("/Management/RenderPartialCreateSubject", null, function (data) {
    $("#dialog-message").html(data);
});
//open add new subject dialog
var dialogOptions = {
    title: "",
    modal: true,
    width: 'auto',
    autoOpen: false
};
$("#dialog-message").dialog(dialogOptions);
$("#dialog-message").dialog("open");

第一次呈现不正确，但第二次（加载内容后）有效。

我会等着看是否有人有更好的答案，但我能够通过将 $.get 替换为 $.ajax 并设置 async: false 来解决它，这允许在显示对话框之前加载内容。

相关文章：