从 iframe 外部调用 javascript 函数答案

【问题标题】：call javascript function from outside an iframe从 iframe 外部调用 javascript 函数
【发布时间】：2011-07-05 16:05:57
【问题描述】：

我在包含 javascript 函数 getData() 的 iframe 中打开了一个完整的 html。现在我不确定如何从该框架外部调用 getData()。也可以从外部 javascript 文件中调用它吗？

【问题讨论】：

重新。从外部文件调用，请参阅下面答案中的更新 [2]。

标签： javascript iframe

【解决方案1】：

您可以从 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()

所有这些都假设框架托管在 same domain 中。

更新[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..
}

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

【讨论】：

【解决方案2】：

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

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

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

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

parent.functionInParent();

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

这是original post。

【讨论】：

【解决方案3】：

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

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

【讨论】：

谢谢你们的回复......但我真正关心的是知道我是否可以从外部 javascript 文件中调用它。
是的，您可以让您的框架加载定义您的函数的外部 js 文件。在从父页面调用 getData 之前，您需要确保框架已加载外部脚本。