从 iframe 内部的 .JS 文件调用父函数答案

【问题标题】：Call to function in parent from .JS file from inside iframe从 iframe 内部的 .JS 文件调用父函数
【发布时间】：2013-02-11 10:16:14
【问题描述】：

我有带有上传功能的 JS 文件。此文件从 iframe 窗口调用。我需要根据用户的操作向用户显示警报。

这是我所做的，但它不起作用：

来自 JS 文件：

$('#btnUpload').on('click', function(){
    parent.CallToParent();
});

并从 UploaderWindow 调用：

function CallToParent()
{
   parent.ShowAlert();
}

在主窗口上：

function ShowAlert()
{
   alert('some alert');
}

【问题讨论】：

你的 iframe 中还有其他 iframe 吗？还是只有一个父级和一个 iframe？
iframe中需要显示警报的JS文件

标签： javascript asp.net html iframe

【解决方案1】：

我认为你做得对。不知道click事件中的parent.CallToParent()是否真的是指父窗口中的函数。如果没有，那么你可以做类似的事情。

来自 JS 文件：

$(document).ready(function () {
    $('#btnUpload').on('click', function() {
        callParent();
    })
});

来自 iframe：

<script type="text/javascript" src="/common/jq.js"></script>
<script type="text/javascript" src="c.js"></script>
<script>
    function callParent() {
        parent.fn();
    }
</script>

<input id="btnUpload" type="button" />

主文件

<script>
    function fn() {
        console.log('Parent function called');
    }
</script>

<iframe src="b.html"></iframe>

【讨论】：

查看我上面发布的代码，它对我有用。我怀疑您在呈现之前将事件绑定到按钮上。你在事件处理程序中尝试过console.log 吗？
我可以从 JS 调用它的父函数，但是从这个函数中它找不到下一个父函数。但是当我直接从 iframe 调用它的父级时，它工作正常。有什么区别？
你为什么要调用CallToParent，就好像它是在父窗口中定义的函数一样？它位于包含 JS 文件的同一页面中。所以它在同一个窗口的范围内。

【解决方案2】：

据我所知，这两个上下文之间不存在脚本互操作性。

如果您可以控制iframe 的内容，那么您可以实现一个“中间人”服务来管道消息。

【讨论】：

他说是文件上传器，他怎么能不控制内容呢？