¿Por qué no se desencadena el evento load en IE para iFrames?Evento de carga para iFrame no activado en IE
Por favor, eche un vistazo a this example.
Funcionan perfectamente como se esperaba en FF y Chrome, pero IE falla.
Creo que para iframes en Internet Explorer no puede establecer ese controlador de eventos (onload) programáticamente, debe especificarlo en su marcado.
Algo así como:
<iframe id="myFrame" onload="myFunction();"></iframe>
De lo contrario IE es sólo va a ignorar la función.
añadir el prefijo "iframe" en frente de su id:
$('iframe#myFrame').load(function() {
...
});
Alternativly trate de usar "listo" en lugar de "carga":
$('#myFrame').ready(function() {
alert("Loaded");
});
Esto debería funcionar.
Gracias, pero el evento 'listo' se dispara antes de que el contenido del iFrame se carga ... – Muleskinner
añadiendo iframe prefijo no trabaja (IE 8) – Muleskinner
no funciona en IE 9 – Damiox
La asignación del controlador directamente al onload funciona en Chrome, FF e IE (probado con IE 8).
(function (selector) {
var frame = $(selector).get(0);
if (frame) {
frame.onload = function() {
alert('frame loaded.');
};
}
})('#myframe');
Es posible que IE ya haya cargado el contenido (y activado el evento) antes de agregar el controlador. Descubrí que cuando especificaba estáticamente iframe src attr y agregué controladores de eventos $ (x) .load a través de jquery, firefox (3.6.28) activó mis controladores pero IE (8.0.6001.18702) no lo hizo.
Terminé ajustando mi programa de prueba para que establezca el iframe src a través de javascript después de agregar el controlador $ (x) .load. Se llamó a mi controlador $ (x) .load en los mismos puntos en IE y Firefox (pero tenga en cuenta que un controlador añadido a través del atributo iframe onload se comportó de forma diferente entre IE y FF). Esto es lo que terminé con:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=Edge">
<script type="text/javascript" src="jquery-ui/js/jquery-1.6.2.min.js"></script>
<script language="javascript">
function show_body(name, $iframe) {
$('.log').append(name+': '+$iframe.contents().find('body').html()+'<br/>');
}
function actuallyLoaded(name, x) {
$('.log').append(name+' actually loaded<br/>');
}
$(document).ready(function(){
$('.i1').load(function(){show_body('i1', $('.i1'));});
$('.i1').attr('src', 'eb_mce_iframe_content.html');
var $x=$('.i1').clone().removeClass('i1');
$('body').append($x);
$x.load(function(){show_body('x', $x);});
$x.attr('src', 'eb_mce_iframe_content.html');
});
</script>
</head>
<body>
<iframe class="i1" onload="actuallyLoaded($(this).attr('class')+'/'+$(this).attr('src'), this);">
</iframe>
<div class="log">
</div>
</body>
</html>
... y aquí estaba el Firefox "log":
i1/eb_mce_iframe_content.html carga realmente i1:
Fred el zorro.
/eb_mce_iframe_content.html carga realmente x:
Fred el zorro.
El uso del código JavaScript con jQuery de here funciona si cambia la línea if ($.browser.safari || $.browser.opera) { al if ($.browser.safari || $.browser.opera || $.browser.msie) {. Por lo tanto, tiene lo siguiente:
$(function(){
var iFrames = $('iframe');
function iResize() {
for (var i = 0, j = iFrames.length; i < j; i++) {
iFrames[i].style.height = iFrames[i].contentWindow.document.body.offsetHeight + 'px';}
}
if ($.browser.safari || $.browser.opera || $.browser.msie) {
iFrames.load(function(){
setTimeout(iResize, 0);
});
for (var i = 0, j = iFrames.length; i < j; i++) {
var iSource = iFrames[i].src;
iFrames[i].src = '';
iFrames[i].src = iSource;
}
} else {
iFrames.load(function() {
this.style.height = this.contentWindow.document.body.offsetHeight + 'px';
});
}
});
Funciona para mí en> = IE7 y Chrome. No revisé otros navegadores. ¡Gracias! – MaciejLisCK
La respuesta de Seis es la correcta, y se puede mejorar para usar funciones no globales/anónimas.
window.dummy_for_ie7 = function() { }
var iframe = $('<iframe onload="dummy_for_ie7" />')[0];
iframe.attachEvent('onload', real_event_handler)
Para mi sorpresa, esto funciona.
Nota: iframe.onload = func() NO funcionaría, incluso después de ese hack. Usted DEBE use attachEvent. Imagínate.
Nota: naturalmente, este código verbatim no funcionará en UAs que cumplan con los estándares.
Utilizo el evento readystatechange para IE.
var $iframe = $("<iframe>");
$iframe.on("load readystatechange", callback);
Funciona en ie 11! – Th3B0Y
Gracias, hombre, me salvó la vida. – CGK
Por cierto. el evento jQuery bound tampoco funciona en FF, especificando 'onload' funciona como esperaba – dolzenko
Parece que no puedo hacer que esto funcione para IE10. '' 'onload =" alert ('moo'); "' '' no alerta. –