判断iframe是否加载完成的完美方法
IE 支持 iframe 的 onload 事件,不过是隐形的,需要通过 attachEvent 来注册。
第二种方法比第一种方法更完美(采用readystatechange判断),因为 readystatechange 事件相对于 load 事件有一些潜在的问题。
这里感觉说的并不是完全准确,开始给我造成了很大的困扰。看其代码才明白,真正意义上来讲IE在创建一个新的iframe时的onload方法需要使用attachEvent来绑定,而原来就存在的iframe的onload方法,则可以直接绑定。
var iframe = document_createElement_x_x("iframe");
iframe.src = "http://www.020cityshop.com";
if (iframe.attachEvent) {
iframe.attachEvent("onload",function() {
alert("Local iframe is now loaded.");
});
} else {
iframe.onload = function() {
alert("Local iframe is now loaded.");
};
}
document.body.a(iframe);
但是实际测试来看,谷歌和IE8浏览器是没有问题的能正确alert弹框,但是在火狐(52.0.1)版本下并没有正确弹框,于是再次进行修改为:
var iframe = document_createElement_x_x("iframe");
iframe.src = "http://www.020cityshop.com";
if (iframe.attachEvent) {
iframe.attachEvent("onload",function() {
alert("Local iframe is now loaded.");
});
}
iframe.onload = function() {
alert("Local iframe is now loaded.");
};
document.body.a(iframe);
不要在else中使用.onload事件,不然火狐情况下是不执行。这样在谷歌、火狐、ie8中都会正确执行load事件了。
实例:使用iframe进行excel下载时候,后台的错误信息可以正确提示
//下载excel,js中直接调用方法,传入url参数就可以下载excel,使用的是get方式
function downloadfile(url) {
var iframe = document.createElement("iframe");
iframe.id='iframe';
iframe.style.display = "none";
iframe.src = url;
document.body.appendChild(iframe);
if (iframe.attachEvent) {
iframe.attachEvent("onload", function() {
alertDownMsg();
});
}
iframe.onload = function(){
alertDownMsg();
};
}
//iframe异常报错信息
function alertDownMsg(){
var win = document.getElementById('iframe').contentWindow;
var innerText=win.document.body.innerText;
var innerJson=JSON.parse(innerText);
if(!innerJson.success){
$.messager.alert({
title:'提示',
msg:innerJson.message
});
}
$("#iframe").remove();
}