Javascript 从 iframe 访问父窗口的元素
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/7027799/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Access elements of parent window from iframe
提问by Paparappa
I have a page we can call parent.php. In this page I have an iframewith a submit form and outside of that I have a div with the id "target". Is it possible to submit the form in the iframe and when success refresh the target div. Say load a new page into it or something?
我有一个我们可以调用的页面parent.php。在这个页面中，我有iframe一个提交表单，除此之外，我还有一个 ID 为“目标”的 div。是否可以在 iframe 中提交表单，并在成功时刷新目标 div。说加载一个新页面到它或什么？
Edit: The target div is in the parent page, so my question is basically if you can make for an example a jQuery call outside the iframe to the parent. And how that would look?
编辑：目标 div 位于父页面中，所以我的问题基本上是您是否可以在 iframe 之外对父页面进行 jQuery 调用。那会是什么样子？
Edit 2: So this is how my jquery code looks like now. It is in the of the iframe page. the div #target is in the parent.php
编辑 2：这就是我的 jquery 代码现在的样子。它位于 iframe 页面的 。div #target 在 parent.php 中
$(;"form[name=my_form]").submit(function(e){
e.preventDefault;
window.parent.document.getElementById('#target');
$("#target").load("mypage.php", function() {
$('form[name=my_form]').submit();
});
})
I don't know if the script is active cause the form submits successfully but nothing happens to target.
我不知道脚本是否处于活动状态，因为表单提交成功，但目标没有任何反应。
Edit 3:
编辑3：
Now I'm trying to call the parent page from a link within the iframe. And no success there either:
现在我试图从 iframe 中的链接调用父页面。那里也没有成功：
<a href="javascript:window.parent.getElementById('#target').load('mypage.php');">Link</a>
回答by barclay
I think the problem may be that you are not finding your element because of the "#" in your call to get it:
我认为问题可能是您没有找到您的元素，因为您在调用中使用了“#”来获取它：
window.parent.document.getElementById('#target');
You only need the # if you are using jquery. Here it should be:
如果您使用 jquery，则只需要 #。这里应该是：
window.parent.document.getElementById('target');
回答by Amr
You can access elements of parent window from within an iframe by using window.parentlike this:
您可以使用以下方法从 iframe 中访问父窗口的元素window.parent：
// using jquery
window.parent.$("#element_id");
Which is the same as:
这与以下内容相同：
// pure javascript
window.parent.document.getElementById("element_id");
And if you have more than one nested iframes and you want to access the topmost iframe, then you can use window.toplike this:
如果你有多个嵌套的 iframe 并且你想访问最顶层的 iframe，那么你可以这样使用window.top：
// using jquery
window.top.$("#element_id");
Which is the same as:
这与以下内容相同：
// pure javascript
window.top.document.getElementById("element_id");
回答by ShankarSangoli
Have the below js inside the iframe and use ajax to submit the form.
在 iframe 中包含以下 js 并使用 ajax 提交表单。
$(function(){
$("form").submit(e){
e.preventDefault();
//Use ajax to submit the form
$.ajax({
url: this.action,
data: $(this).serialize(),
success: function(){
window.parent.$("#target").load("urlOfThePageToLoad");
});
});
});
});
回答by varfoo
I think you can just use window.parent from the iframe. window.parent returns the window object of the parent page, so you could do something like:
我认为您可以只使用 iframe 中的 window.parent。window.parent 返回父页面的 window 对象，因此您可以执行以下操作：
window.parent.document.getElementById('yourdiv');
Then do whatever you want with that div.
然后用那个 div 做任何你想做的事。
