Question

与this question类似，但我的设置略有不同。

我写过这个函数：

function ShowDialog(url, width, height, id, options) {
    var self = arguments.callee;
    if(!self.dialogs) self.dialogs = {};

    var src = url + (url.indexOf('?') === -1 ? '?' : '&') + '_popup=1';
    if(id) src += '&_field=' + encodeURIComponent(id);

    if(url in self.dialogs === false) {
        var defaults = {
            width: width,
            height: height,
            modal: true,
            resizable: false,
            draggable: false,
            closeText: 'Close'
        };

        self.dialogs[url] = $('<div/>')
            .html('<iframe width="100%" height="100%" marginwidth="0" marginheight="0" frameborder="0" scrolling="auto" src="'+src+'">Your browser does not support iframes.</iframe>')
            .dialog(options ? $.extend(defaults, options) : defaults);
    } else {
        if(self.dialogs[url].data('reload')) {
            self.dialogs[url].data('reload', false).children('iframe').attr('src', src);
        }
        self.dialogs[url].dialog('open');
    }
    return false;
}

我使用的是这样的：

<button onclick="return ShowDialog('/companies/add', 400, 320, 'id_company');">New</button>

单击该按钮后，将打开一个包含表单的iframe对话框。当您提交表单时，它会重定向到另一个页面，该页面只包含一个应该关闭对话框的脚本。

在另一个问题中，他拥有iframe的ID，以便找到它，然后拨打.dialog('close')。我已经动态生成了iframe，所以我不知道如何访问它。

但是，我知道我的iframe总是位于具有.dialog对象的div中...应该有一种方法可以从iframe中获取iframe的父元素，不是吗？

任何人都知道怎么做？

我们是否可以找到像

这样的东西

window.parent.jQuery(this).parent()

？我不知道this需要什么。某种对自身的引用...... window不起作用。

Answer 1

window.frameElement为您提供IFrame元素

var parent = $(window.frameElement).parent();

Answer 2

在你的iframe中你可以像这样得到父DOM：

window.parent.frames[0].parentNode;

这假设父窗口中只有1个iframe，iframe是您正在进行此调用的那个

这里可能是（未经测试）另一种方法，在父窗口中创建一个函数，如：

var findParent = function() {
    return $(this).parent();
}

然后在iframe内执行：

window.parent.findParent.call(window);

再次未经测试： - ）

OK第3次尝试。

在ShowDialog函数中而不是return false执行：

return self;

然后在你的iframe缓存中返回一个变量，这样你的按钮就像这样：

<button onclick="obj = ShowDialog('/companies/add', 400, 320, 'id_company'); return false;">New</button>

因此，在此按钮之前的iframe中，您有一个var obj;;

然后，只要您需要iframe的父级，就可以：

obj.dialogs[window.location.pathname];

此IMO应返回iframe的父级。

再次未经测试：D

Answer 3

仅selected answer valipour的{{3}}扩展名，据我所知，效果很好。但是，在我碰巧使用这种方法之前，我必须“发明”一种使用jQuery进行跨浏览的方法。

我经常发现的解决方案是parent.document。这里的问题是，“如果我有多个iFrame，该怎么办？”

因此以下片段！

var parIframe = $(parent.document).find('iframe')
        .filter(function(i){ return $(this).contents()[0] == $(document)[0] });

.filter方法用于将父窗口中每个iFrame的内容与当前iFrame的内容进行比较，从而仅返回您正在查找的iFrame窗口。

Answer 4

我认为这和我们能做的一样好：

<script type="text/javascript">
var $ = window.parent.jQuery;
$('.ui-dialog-content').filter(function(){return $(this).dialog('isOpen');}).dialog('close').data('reload', true);
</script>

它应该允许页面上有多个iframe和jQuery UI对话框，只要2个不同时打开（绝不应该这样）。

修订，提出了valipour的建议。

<script type="text/javascript">
var $ = window.parent.jQuery;
{% if popup_field %}
$('#{{popup_field|escapejs}}').val('{{value|escapejs}}').addClass('selected').focus();
{% endif %}
$(window.frameElement).closest('.ui-dialog-content').dialog('close').data('reload', true);
</script>

（这是一个Django模板）

如何获取iframe的父元素（不仅仅是窗口）？

4 个答案: