jQuery 对话框在我第二次打开时缩小答案

【问题标题】：jQuery dialog shrinks when i open second timejQuery 对话框在我第二次打开时缩小
【发布时间】：2011-03-22 06:21:54
【问题描述】：

我有一个 div（比如 div1），它包含两个下拉框和一个包含另一个 div（比如 div2）的表单。我已将此 div1 定义为 jquery 对话框。在第一个下拉列表更改时，将填充另一个下拉列表，在第二个下拉列表更改时，div2 将加载 ajax 调用的 html 结果。

现在我使用关闭按钮关闭对话框，然后当我尝试重新打开对话框 (div1) 时，对话框高度缩小到上述高度以下。如果我打开对话框而不更改第二个下拉菜单，它工作正常。仅当 onchange 在第二个下拉菜单中发生时，对话框才会缩小。

jQuery 对话框打开 div1：

    $("#fileDoc").dialog({
    bgiframe: true,     
        autoOpen: false,
        height: 680,
        width: 800,
        modal: true,
        resizable: false
});

jQuery 对话框关闭 div1：

$('#fileDoc').dialog('close');

jQuery ajax 调用在 div2 中加载 html：

$("#doc").html(data);

我正在使用 jQuery 1.4.4 和 UI 1.8.2。

【问题讨论】：

标签： jquery jquery-ui-dialog jquery-dialog

【解决方案1】：

关闭时，请确保您正在销毁对话框.dialog( "destroy" )，否则对话框及其内容将隐藏在 DOM 中。这可能会产生问题，因为 ID 是唯一的，并且您只能打开相同 #id 的一个实例。

【讨论】：

【解决方案2】：

我发现了问题。在关闭 div1 对话框之前 div2 应该为空，否则 div2 的高度也会与对话框高度相减，因此它会降低 jQuery UI Dialog 1.8.2 中的高度。

所以，jQuery 对话框关闭 div1：

$("#div2").html(""); $("#fileDoc").dialog("close");

【讨论】：

我的英雄 ;)。我为此浪费了几个小时。我不得不隐藏并显示 jqgrid 来解决我的问题，但是这个答案让我走上了正轨。