jQuery UI 对话框在打开时不遵守位置选项答案

【问题标题】：jQuery UI dialog not obeying position option on openjQuery UI 对话框在打开时不遵守位置选项
【发布时间】：2010-05-30 20:41:53
【问题描述】：

我的代码过去可以正常工作，但我最近将 jQuery UI 更新到 1.8 并将 jQuery 更新到 1.4，因为一些东西不起作用。一旦我这样做了，这些事情就开始起作用了，然而，现在我注意到这个对话框将自己定位在顶部中心，而不是中间中心。

让我先解释一下代码。该代码每 x 分钟查询一次 Ajax 请求，以查看上次访问会话的时间。如果距离他们最后一次点击会话已经 10 分钟，则会出现一个 jQuery UI 对话框 div，并警告他们的会话即将到期，并且有一个按钮可让您通过单独的内联 Ajax 重新点击会话GET 请求而不重新加载整个页面。

这是真正的麻烦。 15 分钟或更长时间后，它应该关闭警告对话框（它会检查它是否已经打开，在这种情况下它“可能是”）然后创建一个带有内联登录表单的新对话框，让您重新验证您的在不重新加载页面的情况下登录（并且丢失任何未保存的、中途填写的表格）。

这是应该关闭警告的功能，创建重新登录div：

function renderReLogin() {
    if ($("#logOutWarning").dialog("isOpen")) {
        $("#logOutWarning").dialog("close"); // Close warning dialog as session has already expired
    }

    if ($("#logOutReLogin").dialog("isOpen") != true)
    {
        $('#noticeContainers').html('<div id="logOutReLogin" title="You\'ve been logged out!"><div id="logOutReLoginText"></div></div>');
    }

    $('#logOutReLoginText').html("This session has expired. In order to protect the integrity of you and your clients, we must limit sessions. To resume this session (and not lose any unsaved work) you must revalidate your credentials by logging in below.<br />" +
        '<br /><div style="color:red;text-align:center;" id="loginFeedback"></div>'+
        '<form id="reloginForm">'+
        '<table width="40%" align="center"><tr><td>E-mail:</td>'+
        '<td><input id="username" type="edit"></td></tr>'+
        '<tr><td>Password</td>'+
        '<td><input id="password" type="password"></td></tr>'+
        '</table></form>'
    );

    $('#logOutReLogin').dialog(
        {
            width: '50%',
            modal: true,
             show: 'scale',
            hide: 'scale',
            draggable: false,
            resizable: false,
            position: 'center',
            buttons: {
                "Re-Login": function() { retryLogin(); },
            }
        }
    );
}

现在就像我上面所说的，警告打开正常，然后关闭正常。但是重新登录对话框会捕捉到视口的最顶部中心，而不是中间中心。

当我手动调用 $("#logOutReLogin").dialog("option", "position", "center" );通过 Firefox 中的 Firebug 在它已经打开后，它确实会转到它应该在的位置。这似乎是上述函数中的开放行为。

【问题讨论】：

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

【解决方案1】：

经过反复试验，我相信我找到了它无法正常工作的原因。警告对话框的隐藏动画似乎与重新登录对话框的显示动画冲突。

我移动了很多东西，并在注释掉动画设置后注意到了最理想的结果，所以我假设就是这样 - 但它可能是我在实验时更改的一些东西的组合。

我不确定这是否是一个已知的禁忌，以我做/做的方式进行设置。但我认为实际上并不需要为此制作动画，因为它们弹出的可能原因是用户没有查看标签。

【讨论】：