带有多个对话框的 JQuery UI 对话框问题答案

【问题标题】：JQuery UI Dialog Issue with Multiple Dialogs带有多个对话框的 JQuery UI 对话框问题
【发布时间】：2011-09-24 16:38:30
【问题描述】：

我有几个对话框（jquery-ui-ified），它们看起来都像这样：

$('#options_dlg').dialog({
    modal:true,
    stack:true,
    autoOpen:false,
    resizable:false,
    title:'Options',
    height:620,
    width:520,
    zIndex:20000 
});

我遇到的问题是，当我打开一个对话框，然后我打开另一个对话框或关闭另一个对话框时，它会重新定位第一个对话框 - 有时会移动它，因此我无法再访问标题栏移动它。

当然，脚本中发生的许多事情可能是罪魁祸首 - 尽管对我来说没有什么是显而易见的 - 意思是，我没有代码指定通过打开或关闭对话框，而不是它应该重新定位任何其他对话框。

所以我的问题是，以前有没有人以任何身份经历过这种情况，和/或是否有人对导致这种情况发生的原因有任何见解 - 我可以用来开始追查罪魁祸首的任何事情都会有所帮助.

谢谢-

【问题讨论】：

这似乎与 jquery-ui 1.8.14 有关。我换了 1.7.2 版，问题没有出现。所以，我想也许我应该把这个提交给 jquery ui 团队？
你能做一个快速演示吗？
1.8.16 怎么样？每当我遇到类似的奇怪问题时，几乎总是因为该页面中存在具有重复 ID 或类似内容的元素。

标签： javascript jquery jquery-ui dialog

【解决方案1】：

我确实在 jquery-ui 1.8.16 中并且仅在 IE 中遇到过类似的问题。它看起来像known issue，我使用了以下方法

$dialog.parent().css({position:"fixed"}).end().dialog('open');

来自this solution 并解决了它。你也可以试试。

【讨论】：

差不多 2 年后使用最新版本的 jquery ui，这完全解决了我的问题

【解决方案2】：

尝试设置对话框打开时的位置。

$('#options_dlg').dialog({
    modal:true,
    stack:true,
    autoOpen:false,
    resizable:false,
    title:'Options',
    position: [x,y],
    height:620,
    width:520,
    zIndex:20000 
});

在设置对话框之前，根据您希望对话框出现的位置将 x 和 y 初始化为偏移量。

例如：

x = $(cell).offset().left + $(cell).outerWidth();
y = $(cell).offset().top - $(document).scrollTop();

您必须弄清楚如何确定应用程序的 x 和 y 偏移量，但这应该会修复对话框位置，以便在使用其他对话框时它不会随机移动。

【讨论】：