从iframe访问父窗口的元素

Question

我有一个可以打电话的页面parent.php.在这个页面中,我有iframe一个提交表单,除此之外,我有一个id为"target"的div.是否可以在iframe中提交表单,并在成功时刷新目标div.说加载一个新的页面或什么？

编辑:目标div位于父页面中,所以我的问题基本上是你可以在iframe之外为父节点做一个jQuery调用.那看起来怎么样？

编辑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(); 
 }); 
 })

我不知道脚本是否处于活动状态,因为表单成功提交但目标没有任何反应.

编辑3:

现在我正在尝试从iframe中的链接调用父页面.那里也没有成功:

<a href="javascript:window.parent.getElementById('#target').load('mypage.php');">Link</a>

Answer 1

我认为问题可能是你没有找到你的元素,因为你的调用中有"#"来获取它:

window.parent.document.getElementById('#target'); 

如果您使用的是jquery,则只需要#.这应该是:

window.parent.document.getElementById('target'); 

Answer 2

您可以使用以下方式从iframe中访问父窗口的元素window.parent:

// using jquery    
window.parent.$("#element_id");

这与以下相同:

// pure javascript
window.parent.document.getElementById("element_id");

如果您有多个嵌套的iframe并且想要访问最顶层的iframe,那么您可以window.top像这样使用:

// using jquery
window.top.$("#element_id");

这与以下相同:

// pure javascript
window.top.document.getElementById("element_id");

Answer 3

在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");
          });
       });

   });

});

Answer 4

我想你可以使用iframe中的window.parent.window.parent返回父页面的window对象,因此您可以执行以下操作:

window.parent.document.getElementById('yourdiv');

然后用那个div做你想做的事.