如何从父级 JavaScript 页面访问子 iframe 元素？

Question

我在我的页面中有一个iframe代码。当我点击特定的链接时，iframe窗口被启用。它是一个表单。当我提交表单时，我会得到一些隐藏字段的值。如何在我的父页面中访问这些值？

- Ravichandran Jothi

---

请展示一些代码。您将表单提交到哪里？ - Pekka

<iframe name="signUp" id="signup" src="http://10.80.32.9:8080/app/appsignup.jsp" width="650" height="500"></iframe>

---

<script type="text/javascript"> var inter = setInterval(check,1000); function check(){ if(window.frames['signUp'].document.getElementById('registrationstatus').value == "ok"){ alert("welcome"); document.getElementById('appclose').style.display='block'; clearInterval(inter); } } </script> - Ravichandran Jothi

听起来像是http://stackoverflow.com/questions/5728620/how-to-add-css-in-this-iframe。 - Rudie

有没有可能返回到父页面的URL？ - Ravichandran Jothi

Answer 1

由于您的iframe src是完整的url，而不是相对路径（例如：/app/appsignup.jsp），我将假设此Iframe存在于原始页面所在的IP或域之外。如果这个假设是正确的，那么由于大多数浏览器中的跨站点脚本安全规则，您将无法修改Iframe的DOM。

如果父站点和子Iframe存在于同一个顶级域中，则可以使用document.getElementById("iframe_id")。

编辑以回答第二个问题：

您可以向iframe添加onLoad事件，只要iframe只有1个表单，并且页面仅在提交时更改，并且这是您想要重定向的位置。

以下是一个示例，但请注意，这将在第一次重定向时失败！你需要在其中放置一个函数，然后在该函数的.js中检查第二个onLoad...

<iframe name="signUp" id="signup" src="10.80.32.9:8080/app/appsignup.jsp"; width="650" height="500" onLoad="window.location('/index.html');">

- David Houde

---

有没有可能返回到父页面的URL？ - Ravichandran Jothi

更新了答案以提供一些启示。抱歉没有例子，如果需要的话我会在稍后用更多时间回来的。 - David Houde

Answer 2

如果iframe位于不同的域名和/或端口上，您将无法访问它，就像您的情况一样。 同源策略 将阻止此操作。

根据您的用例，可能会有一些解决方法。也许可以添加更多细节。

- Pekka