Javascript 无法从父级（firefox加载项）调用iframe函数_Javascript_Firefox Addon_Firefox Addon Sdk

Javascript 无法从父级（firefox加载项）调用iframe函数

javascript firefox-addon

Javascript 无法从父级（firefox加载项）调用iframe函数,javascript,firefox-addon,firefox-addon-sdk,Javascript,Firefox Addon,Firefox Addon Sdk,我正在开发一个firefox插件，我需要的功能之一是在用户导航的页面中插入一个弹出元素我尝试在身体中注入一个DIV，但是我的DIV在页面CSS中有问题，每个页面的弹出显示都不一样，所以我决定将它添加到iframe中以下是加载项代码： main.js 我在这里做的是在每个页面上安装一个页面mod，注入jquery和我的modPage.js，并在连接时调用“注入”端口。 iframecontent.html： <html> <head> <title

我正在开发一个firefox插件，我需要的功能之一是在用户导航的页面中插入一个弹出元素

我尝试在身体中注入一个DIV，但是我的DIV在页面CSS中有问题，每个页面的弹出显示都不一样，所以我决定将它添加到iframe中

以下是加载项代码： main.js

我在这里做的是在每个页面上安装一个页面mod，注入jquery和我的modPage.js，并在连接时调用“注入”端口。 iframecontent.html：

<html>
    <head>
    <title>title</title>
    <script type="text/javascript">
        window.showPopup = function() {
        }
    </script>
    </head>
    <body>
        body
    </body>
</html>


标题
window.showPopup=函数（）{
}
身体

这是一个非常简单的HTML文件，带有一个脚本标记，它定义了我想从父文档调用的showPopup函数

modPage.js：

self.port.on("inject", function(iframeContent) {
    $(function(){
        if(window.frameElement == null) {
            $('body').append(
                '<div id="myExternalDiv" style="position:fixed;width:2560;height:auto;float:left;left:0px;top:0px;z-index:2147483647;overflow-x:hidden;overflow-y:hidden;background: transparent;margin: 0px;padding: 0px;">' +
                '<iframe id="myMagicIframe" width="100%" height="100%" frameborder="0" style="width:100%; overflow-y: hidden;background-color:transparent;" scrolling="no" marginheight="0" frameborder="0" allowtransparency="true" onload="alert(1)"></iframe>' +
                '</div>'
            );

            try {
                var oIframe = document.getElementById("myMagicIframe");
                var iframeDoc = (oIframe.contentWindow.document || oIframe.contentDocument);

                iframeDoc.open();
                iframeDoc.write(iframeContent);
                iframeDoc.close();
            } catch (err) {
                alert(err);
            }

            setTimeout(function(){func()}, 5000);          
        }
    });
});

function func() {
    if (document.getElementById("myMagicIframe") != null) {
        try {
            document.getElementById("myMagicIframe").contentWindow.showPopup();
        }catch(err) {
            alert(err);
            setTimeout(function(){func()}, 1000);
        }
    }
}

self.port.on（“注入”，函数（iframeContent）{
$（函数（）{
if（window.frameElement==null）{
$（'body'）。追加(
'' +
'' +
''
);
试一试{
var oIframe=document.getElementById（“MyMagicFrame”）；
var iframeDoc=（oIframe.contentWindow.document | | oIframe.contentDocument）；
iframeDoc.open（）；
iframeDoc.write（iframeContent）；
iframeDoc.close（）；
}捕捉（错误）{
警惕（err）；
}
setTimeout（function（）{func（）}，5000）；
}
});
});
函数func（）{
if（document.getElementById（“MyMagicFrame”）！=null）{
试一试{
document.getElementById（“MyMagicFrame”）.contentWindow.showPopup（）；
}捕捉（错误）{
警惕（err）；
setTimeout（function（）{func（）}，1000）；
}
}
}

“inject”在div中创建一个iframe，在其中写入iframecontent，并在5秒后调用func函数。发生的情况是，我收到以下异常： “showPopup不是一个函数”。未定义document.getElementById（“MyMagicFrame”）.contentWindow.showPopup

如果我在HTML中添加上述代码并在firefox中运行，它会工作并调用showPopup函数，但在插件中它不工作

我正在使用插件生成器：

谢谢

这是因为，与从不同服务器（或在本例中，通过资源uri）加载iFrame的任何页面一样，您无法跨越帧边界访问其他文档

我的最佳建议是将内容脚本附加到iframe，然后将消息发送回main.js，main.js可以将消息路由到附加到父文档的内容脚本。这是间接的，但它会起作用

有关更多信息：

类似的示例，但使用面板：

关于使用内容脚本的文档：

首先感谢canuckistani让我了解代理概念。当您添加页面修改时，您的脚本将在沙箱上运行，并且您使用的变量是代理

更改以下文件：

document.getElementById("myMagicIframe").contentWindow.showPopup();

到

解决了这个问题

我的iframe被添加到页面中，因此showPopup函数被添加到真实窗口对象中。currentWindow对象是代理，没有添加的函数。使用wrappedJSObject对象，我能够得到真实的窗口对象并调用函数。

对不起，我认为这是不对的。iframe不是从不同的域加载的，我是从页面中注入的脚本创建iframe的。因此，它与父文档位于同一个域中。您可以通过添加以下行进行检查：alert（document.getElementById（“myMagicIframe”）.contentWindow.body.innerHTML）；就在调用函数之前，它会显示主体的HTML代码，这样我就可以访问其他文档了。好吧，我误解了你的意思。您仍然存在一个基本问题，即iframe是从内容脚本注入的，因此它与实际窗口的关系是通过代理的——这可能是您真正的问题。如果您想要注入到真实的窗口中，您将需要使用unsafeWindow并考虑安全影响。

document.getElementById("myMagicIframe").contentWindow.showPopup();

document.getElementById("myMagicIframe").contentWindow.wrappedJSObject.showPopup();