Recuperación del iframe padre de un documento en jQuery

Tengo una página con un iframe que tiene un documento html dentro. Necesito acceder a la identificación del iframe de ese documento secundario, y no tengo suerte de hacerlo con jQuery. La estructura esencial es esta dentro de mi página:Recuperación del iframe padre de un documento en jQuery

<div id="ContainingDiv"> 
    <iframe id="ContainingiFrame"> 
    <html> 
    <head></head> 
    <body> 
    </body> 
    </html> 
    </iframe> 
</div>

En mi método JavaScript que puede llegar a nada en los <body> etiquetas usando selectores de jQuery, pero no puede recuperar el elemento iframe con el fin de cambiar su tamaño. He intentado algunas cosas, pero no soy un experto en la navegación DOM de jQuery, particularmente donde están involucrados iframes (el iframe está en el mismo dominio que la página que lo contiene). ¿Hay alguna forma de que pueda hacer esto?

Fuente

2012-08-24 larryq

¿Qué hace usted? significa por el "elemento iframe", el propio iframe con una ID de 'ContainingiFrame' o un elemento dentro del iframe. ¿Qué es exactamente lo que estás tratando de cambiar el tamaño? – adeneo

adeneo, estoy interesado en el ContainingiFrame en sí mismo. He tenido algunas respuestas excelentes a continuación y desearía poder aceptarlas todas. – larryq

No necesita jQuery en absoluto. Para obtener el objeto cuerpo de su padre, usted puede hacer esto:

var parentBody = window.parent.document.body

Si está en el mismo dominio que el iframe que está ejecutando el código de, una vez que tienes eso, se puede usar javascript normal de dicho objeto:

window.parent.document.getElementById("ContainingiFrame").style.height = "400px";

o con jQuery:

$("#ContainingiFrame", parentBody).height("400");

He aquí un artículo sobre el cambio de tamaño de un iframe dentro del marco flotante con código de ejemplo: http://www.pither.com/articles/2010/11/12/resize-iframe-from-within

Y, una pregunta relacionada/respuesta en el cambio de tamaño de un iframe en base a su propio contenido: Resizing an iframe based on content

Fuente

2012-08-24 17:51:54 jfriend00

Estoy buscando esta información por más de 2 horas; trabaja para mis esfuerzos – MiBol

Prueba esto:

Cambio de tamaño de algún elemento dentro iframe:

$('#ContainingiFrame', window.parent.document).find('#someDiv').css('height', '200px');

O simplemente cambiar el tamaño del iframe:

$('#ContainingiFrame', window.parent.document).height('640');

Fuente

2012-08-24 17:47:49

Prueba esto:

$("#ContainingiFrame").contents().find("#someDiv");

Fuente

2012-08-24 17:49:05

Para acceso a los documentos de los padres de su iframe puede agregar un parámetro a sus selectores, por defecto es el documento pero nada le impide cambiar el contexto de window.parent.document así:

$('#ContainingiFrame', window.parent.document).whatever();

O añádalo a su selector:

window.parent.$('#ContainingiFrame').whatever();

Fuente

2012-08-24 17:51:40

Si usted no tiene información sobre el marco flotante (tal como un identificador para consultar con) entonces usted desea utilizar el frameElement de la ventana de la siguiente manera:

var iframe_tag_in_parent_window = window.frameElement;

Ahora usted tiene la etiqueta iframe sí mismo y puede trabajar con él directamente en JavaScript.

Para utilizar jQuery en lugar de llanura JavaScript, utiliza el siguiente:

var iframe_in_jquery = jQuery(window.frameElement, window.parent.document);

simplemente Hablamos de la primera parte (window.frameElement). La segunda parte es el contexto en el que jQuery encontrará el elemento y lo ajustará. Este es el documento principal de nuestra ventana actual.

Por ejemplo, si usted tiene un identificador único en la etiqueta iframe que podría hacer:

var iframe_in_jquery = jQuery(window.frameElement, window.parent.document), 
    id = iframe_in_jquery.attr("id");

Ahora id es el identificador si el iframe su código JavaScript se ejecuta en.

P.S. si window.frameElement es nulo o indefinido, entonces no está en un iframe.

P.P.S tenga en cuenta que para ejecutar el código en la ventana principal, es posible que necesite utilizar la instancia principal de jQuery(); esto se hace usando window.parent.jQuery(...). ¡Esto es particularmente cierto si intentas trigger() un evento!

P.P.P.S. asegúrese de usar window.frameElement y no solo frameElement ... algunos navegadores están algo rotos y no siempre podrán acceder a los datos correctos si no están completamente calificados (aunque en 2016 ese problema puede resolverse?)

Fuente

2016-04-06 08:08:17

Ya, frameElement realmente nos permite obtener la ventana del contenedor de marcos sin conocer la identificación o algo así. No estoy seguro de cuándo esta propiedad se validó, pero mdn dice que se puede usar en navegadores muy antiguos. – Eric

Recuperación del iframe padre de un documento en jQuery

Respuesta

Cuestiones relacionadas