从父页面调用iframe中的JavaScript代码

基本上，我在页面中嵌入了一个iframe，该iframe有一些需要从父页面调用的JavaScript例程。

现在相反的是相当简单，因为你只需要调用parent.functionName()，但不幸的是，我需要的恰恰相反。

请注意，我的问题不是改变iframe的源URL，而是调用iframe中定义的函数。

当前回答

IFRAME应该在frames[]集合中。使用像这样的东西

frames['iframeid'].method();

其他回答

试试parent.myfunction()

我找到了一个很好的解决办法。

正如您所说，执行位于父文档中的代码相当容易。这是我代码的基础，做的正好相反。

当我的iframe加载时，我调用父文档上的一个函数，将一个引用作为参数传递给位于iframe文档中的一个局部函数。父文档现在可以通过这个引用直接访问iframe的函数。

例子:

在父节点上:

function tunnel(fn) {
    fn();
}

在iframe中:

var myFunction = function() {
    alert("This work!");
}

parent.tunnel(myFunction);

当iframe加载时，它将调用parent.tunnel(YourFunctionReference)，它将执行parameter中接收到的函数。

这很简单，不需要处理来自各种浏览器的所有非标准方法。

使用following调用父页中帧的函数

parent.document.getElementById('frameid').contentWindow.somefunction()

假设你的iFrame的id是"targetFrame"，你想调用的函数是targetFunction():

document.getElementById('targetFrame').contentWindow.targetFunction();

你也可以使用window.frames而不是document.getElementById来访问帧。

// this option does not work in most of latest versions of chrome and Firefox
window.frames[0].frameElement.contentWindow.targetFunction();

同样的事情，但更简单的方法将是如何从iframe中的页面刷新父页面。只需调用父页面的函数来调用javascript函数来重新加载页面:

window.location.reload();

或者直接从iframe中的页面执行此操作:

window.parent.location.reload();

这两个工作。

推荐文章