2010-03-12 37 views
22

¿Cómo se puede detectar que cuando el contenido de iframe ha cambiado y hacer algo sobre ese código de cambio seudo continuacióniframe contents change event?

$('#waframe').contents().change(function(){ 
    //do stuff 
    }); 

Respuesta

24

Bueno, parece que el navegador generará un evento de "carga" en un elemento en el contexto de la contenga página. La "carga" se dispara cuando se cambia "src"; no estoy seguro de si se dispara cuando el iframe se cambia a sí mismo.

edición: sí, sí parece disparar cuando la página se recarga "internamente"

Por lo tanto es posible que trate:

$('iframe#yourId').load(function() { 
    alert("the iframe has been loaded"); 
}); 
+0

no parece que esta al fuego en Safari u Opera No he comprobado es decir, cromo o aún – mcgrailm

+0

Hmm. Bueno, la documentación de Microsoft no es clara en el tema. Para probarlo, todo lo que hice fue tener una pequeña página con un iframe, y apunté el iframe a un dominio aleatorio mío. En la página de prueba, configuré un oyente de eventos jQuery para "cargar" en el elemento iframe. – Pointy

+0

funciona en ff y eso es genial, pero voy a necesitar algo que funcione en todo el tablero o al menos la mayor parte del camino – mcgrailm

4

estoy haciendo un truco Litle (suciedad, pero funciona) :) para visualizar un objeto que se carga

function changeDet(old){ //detect src changes 
    if($("iframe#ifID").attr('src') != old){ 
     $("iframe#ifID").width(0); //error if i hide ...? 
    } 

    setTimeout('changeDet("' + $("#db").attr('src') + '")',10); 
} 

var df = $('#iframe#ifID'); 

df.load(function(){ //content loaded 
setTimeout('$("#db").width(var_default_width);',100); 
}); 

changeDet(); 

$(function(){ 
    //jq stuffs... 
}) 
</script> 
+0

No es muy viable porque tiene que hacer comparaciones de cadenas por cada 10 milisegundos, lo que puede ser fácilmente una carga cuando el tamaño del documento aumenta a los MB. –

+0

Evitar el uso de cadenas en 'setTimeout' es a) un riesgo de seguridad, b) lento, c) imposible para el intérprete JS manejar con cordura. – Sukima

1

puede utilizar este evento para disparar sobre el cambio .. Funciona en IE8 y Firefox

if(document.addEventListener){ 
    yourIFrameObject.contentWindow.document.addEventListener('keyup', yourFunction, false); 
    // window.frames[0].document.addEventListener('keyup', yourFunction, false); 
} 
else{ 
//for IE8 
    yourIFrameObject.contentWindow.document.attachEvent('onkeyup', yourFunction); 
} 

Se puede usar un comunicado mouseup si es necesario

+0

esto no funcionará para fuentes de dominio cruzado – David