jquery - example - iframe html
Ejecute JQuery en el contexto de otro marco (4)
El cliente con el que estoy trabajando tiene un conjunto de marcos como ese ...
<frameset rows="100,*, 0">
<frame name="theFrame" id="theFrame" src="blah.html" >
<frame name="theSecondFrame" id="theSecondFrame" src="foo.html" >
<frame name="importantFrame" id="importantFrame" src="myFrame.html" >
</frameset>
Cuando se produce una determinada acción, necesito que mi marco (el importante que está actualmente oculto) tome principalmente la página y bloquee cualquier interacción con los otros marcos. Estoy planeando bloquear la interacción usando el plugin UI del bloque jquery.
El problema es que no puedo cambiar los archivos foo.html o blah.html. Entonces el código JS no puede vivir allí. Lo que necesito hacer es ejecutar mi código jquery en el contexto de esos marcos . Solo para recapitular, necesito que mi código JQuery viva en myFrame.html pero se ejecute en el contexto de los otros marcos. ¿Cómo puedo hacer eso? Espero que tenga sentido.
Gracias CDR
Como dijo pjb3, establece el contexto de jQuery. Si tiene marcos anidados, su código se verá así:
$(''*'',window.parent.frames[0].frames[0].document).size();
O, mejor aún, crea un atajo:
targetFrame = window.parent.frames[0].frames[0].document;
$(''*'',targetFrame).size();
En versiones de jQuery> = 1.7 no podemos obtener eventos de la manera anterior
Versiones anteriores (<1.7):
var events = $(''#form'').data(''events'');
1.7 y más reciente:
var events = $.fn.data($(''#form''), ''events'');
La función jQuery , que más comúnmente llama con $ , toma un segundo argumento llamado contexto, que es "en qué elemento DOM del objeto jQuery debería hacer la búsqueda". La mayoría de las veces omite este argumento, por lo que el contexto se predetermina al documento HTML actual. Cuando su código se está ejecutando en el iframe, el documento se convierte por defecto en el documento de ese iframe. Pero puede agarrar fácilmente el documento para uno de los otros marcos.
Por ejemplo, ponga esto en myFrame.html , y esto eliminará todos los elementos h1 del marco con blah.html en él. Observe el segundo argumento para $ , que es la expresión que toma el marco blah dentro del marco importante:
<html>
<head>
<script type="text/javascript" src="/javascripts/jquery.js"></script>
<script type="text/javascript">
function doIt() {
$(''h1'', window.parent.frames[0].document).remove()
}
</script>
</head>
<body>
<h1>My Frame</h1>
<a href="#" onclick="doIt()">Do It</a>
</body>
</html>
No estoy seguro del complemento de bloque, pero no puede obtener el marco relevante y manipularlo utilizando el "árbol de marco", algo como esto: (desde dentro de importantFrame.htm)
parent.theFrame.someProperty = someValue;
p.ej:
parent.theFrame.location.href=''anotherPage.html'';
Por lo que he estado leyendo, es posible que necesites Jquery en la página de destino, pero podrías intentar algo como:
parent.theFrame.block();
o tal vez:
$(''#theFrame'').block();