jQuery 未在 IE 中触发 iFrame 的加载事件
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/4334520/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Load event for iFrame not fired in IE
提问by Muleskinner
Why is the loadevent not fired in IE for iFrames?
为什么load没有在 IE 中为 iFrame 触发该事件？
Please take a look at this example.
请看一下这个例子。
Work perfectly as expected in FF and Chrome, but IE fails.
在 FF 和 Chrome 中按预期完美工作，但 IE 失败。
回答by Seis
I think for iframes in Internet Explorer you can't set that event handler (onload) programmatically, you need to specify it in your markup.
我认为对于 Internet Explorer 中的 iframe，您无法以编程方式设置该事件处理程序（onload），您需要在标记中指定它。
Something like:
就像是：
<iframe id="myFrame" onload="myFunction();"></iframe>
Otherwise IE is just going to ignore the function.
否则 IE 将忽略该功能。
回答by Trevor
IE might have already loaded the content (and fired the event) before you add the handler. I found that when I statically specified the iframe src attr, and added $(x).load event handlers via jquery, firefox (3.6.28) triggered my handlers but IE (8.0.6001.18702) didn't.
在您添加处理程序之前，IE 可能已经加载了内容（并触发了事件）。我发现当我静态指定 iframe src attr 并通过 jquery 添加 $(x).load 事件处理程序时，firefox (3.6.28) 触发了我的处理程序，但 IE (8.0.6001.18702) 没有。
I ended up adjusting my test program so that it set the iframe src via javascript after adding the $(x).load handler. My $(x).load handler was called at the same points in IE and Firefox (but note a handler added via iframe onload attribute behaved differently between IE and FF) . Here is what I ended up with:
我最终调整了我的测试程序，以便在添加 $(x).load 处理程序后通过 javascript 设置 iframe src。我的 $(x).load 处理程序在 IE 和 Firefox 中的相同点被调用（但请注意，通过 iframe onload 属性添加的处理程序在 IE 和 FF 之间的行为不同）。这是我最终的结果：
<!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>
... and here was the Firefox "log":
...这是Firefox的“日志”：
i1/eb_mce_iframe_content.html actually loaded i1:
i1/eb_mce_iframe_content.html 实际加载了 i1：
Fred the fox.
狐狸弗雷德。
/eb_mce_iframe_content.html actually loaded x:
/eb_mce_iframe_content.html 实际加载了 x:
Fred the fox.
狐狸弗雷德。
回答by Sarah Vessels
Using the JavaScript code with jQuery from hereworks if you change the if ($.browser.safari || $.browser.opera) {line to if ($.browser.safari || $.browser.opera || $.browser.msie) {. So you have the following:
使用从与jQuery JavaScript代码在这里如果你改变了工作if ($.browser.safari || $.browser.opera) {线if ($.browser.safari || $.browser.opera || $.browser.msie) {。所以你有以下几点：
$(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';
});
}
});
回答by Ilya
I uses readystatechangeevent for IE.
我readystatechange为 IE使用事件。
var $iframe = $("<iframe>");
$iframe.on("load readystatechange", callback);
回答by Devin
Assigning the handler directly to onloadworks in Chrome, FF, and IE (tested with IE 8).
将处理程序直接分配给onloadChrome、FF 和 IE（使用 IE 8 测试）。
(function (selector) {
var frame = $(selector).get(0);
if (frame) {
frame.onload = function () {
alert('frame loaded.');
};
}
})('#myframe');
回答by EvilMM
Add the prefix "iframe" in front of your id:
在您的 id 前添加前缀“iframe”：
$('iframe#myFrame').load(function() {
...
});
Alternativly try to use "ready" instead of "load":
或者尝试使用“就绪”而不是“加载”：
$('#myFrame').ready(function() {
alert("Loaded");
});
This should work.
这应该有效。
回答by driedfruit
Seis's answer is the correct one, and can be improved to use non-global/anonymous functions.
Seis 的答案是正确的，可以改进以使用非全局/匿名函数。
window.dummy_for_ie7 = function() { }
var iframe = $('<iframe onload="dummy_for_ie7" />')[0];
iframe.attachEvent('onload', real_event_handler)
To my surprise, this works.
令我惊讶的是，这有效。
Note: iframe.onload = func() would NOT work, even after that hack. You MUSTuse attachEvent. Go figure.
注意： iframe.onload = func() 不起作用，即使在那个黑客之后。您必须使用 attachEvent。去搞清楚。
Note: naturally, this code verbatimwill not work in standard-compliant UAs.
注意：自然，此代码逐字无法在符合标准的 UA 中工作。
