从外部调用iframe中的JavaScript函数

Question

从外部调用iframe中的JavaScript函数

javascriptiframe

9

我有一个完整的HTML页面嵌套在iframe中，其中包含一个名为getData()的JavaScript函数。现在我不确定如何从框架外部调用getData()函数。另外，是否可以从外部JavaScript文件中调用它？

- Hector Barbossa

有关于从外部文件调用的问题，请参见下面答案中的更新[2]。 - johnhunter

3个回答

1

在某些情况下，可能需要从父文档内部调用iframe中的javascript函数，反之亦然，即从iframe中调用父文档中的javascript函数。

例如：父文档带有id属性'iFrameId'的iframe，且在该iframe文档中定义了函数'functionInIframe()'。以下代码可以从父文档本身调用该iframe函数。

document.getElementById('iFrameId').contentWindow.functionInIframe();

以下代码可以从iframe本身调用在父文档中定义的函数(functionInParent())。

parent.functionInParent();

这样JavaScript就可以在父文档和iframe之间进行交互。

这是原始帖子。

- Lalit Kumar Maurya

0

在这些情况下，您需要为使用/启动框架的主体和iframe命名，然后使用parent.objectname，在JS中一切都是对象，您应该能够调用getData()。

快速搜索让我找到了这个-> http://www.esqsoft.com/javascript_examples/iframe_talks_to_parent/。

- Kumar

谢谢你们的回复，但我的真正关注点是想知道我是否可以从外部JavaScript文件中调用它。 - Hector Barbossa

是的，您可以让您的框架加载一个外部JS文件来定义您的函数。在从父页面调用getData之前，您需要确保该框架已经加载了外部脚本。 - johnhunter

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- johnhunter · Accepted Answer

你可以从window.frames属性获取到框架窗口对象的引用。请参阅https://developer.mozilla.org/en/DOM/window.frames

更新：

你可以通过 window [framename] 访问命名iframe的全局上下文。例如：

<iframe src="data.html" name="data"></iframe>

<script>
var myData = window.data.getData();
</script>

虽然你需要确保iframe已经加载完成。

在jQuery中，如果你想要访问iframe的DOM，可以使用contents方法：

$("iframe").contents()

所有这些都是基于嵌入在同一域内的框架。

更新[2]:

您问是否可以从外部js文件调用getData函数。答案是肯定的（如果我理解你的意思正确的话）。这是一个示例：

<html>
<head>
    <meta charset="utf-8">
    <title>parent page</title>
</head>
<body>

    <iframe src="data.html" name="data"></iframe>
    <script src="getdata.js"></script>

</body>
</html>

然后在getdata.js文件中：

var dataFrame = window.data;

// when the frame has loaded then call getData()
dataFrame.onload = function () {
    var myData = dataFrame.getData();
    // do something with myData..
}

希望这回答了你的问题 :)