javascript - funcion - Acceda a los elementos de la ventana principal desde iframe

obtener datos de un iframe

Question

Tengo una página que podemos llamar parent.php. En esta página tengo un iframe con un formulario de envío y, además, tengo un div con el id "objetivo". ¿Es posible enviar el formulario en el iframe y cuando sea exitoso actualizar el div de destino? Digamos cargar una página nueva o algo así?

Editar: El div de destino está en la página padre, por lo que mi pregunta es básica si puede hacer un ejemplo de una llamada jquery fuera del iframe al padre. ¿Y cómo se vería eso?

Edit 2: Así es como se ve mi código jquery ahora. Está en la página de iframe. el div #target está en 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(); 
 }); 
 })

No sé si el script está activo porque el formulario se envía con éxito, pero no ocurre nada al destino.

Editar 3:

Ahora estoy tratando de llamar a la página principal desde un enlace dentro del iframe. Y tampoco tuvo éxito allí

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

Answer 1

Creo que el problema puede ser que no encuentre su elemento debido al "#" en su llamada para obtenerlo:

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

Solo necesita el # si está usando jquery. Aquí debería ser:

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

Answer 2

Creo que puedes usar window.parent del iframe. window.parent devuelve el objeto de ventana de la página primaria, por lo que podría hacer algo como:

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

Entonces haz lo que quieras con ese div.

Answer 3

Puede acceder a los elementos de la ventana primaria desde dentro de un iframe usando window.parent siguiente manera:

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

Que es lo mismo que:

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

Y si tiene más de un iframes anidado y desea acceder al iframe superior, entonces puede usar window.top como este:

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

Que es lo mismo que:

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

Answer 4

Tenga las siguientes js dentro del iframe y use ajax para enviar el formulario.

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

   });

});