jquery对话框在显示时改变它的dom位置

Question

我的网页结构如下：

它由多个iframe元素组成。热门iframe有一个按钮，当用户按下它时我想在整个页面上显示modal dialog（不在顶部iframe内）。 因此，我使用以下代码动态创建和附加dialog元素：

var context = findMainWindow();//returns the main page window, out of scope
var modalDialog = $('body', context.document).append('<div id="' + dialogName + '" />').find('#' + dialogName);

这段代码有效，我看到元素被注入主页的dom：

然后我调用.dialog方法来显示它：

  $modalDialog.dialog({
            autoOpen: true,
            modal: true,
            height: h,
            width: w,
            resizable: false,
            close: function () {
                $modalDialog.dialog('destroy');
                $modalDialog.remove();
            }
        });

，但不是在整个页面上显示它，而是将元素移动到iframe的dom中，初始按钮位于iframe的dom中。这是插图：

如何让它显示在整个页面的主体上，注入后元素属于哪个？

Answer 1

对于遇到相同行为的人 - 它只是jquery-ui中的一个错误。升级到最新版本解决了这个问题。