我写了一个上传图片的js,在IE6和火狐的IE TAB里都好用,可是到了IE7里就不行了,检查了一下原因:是我声明的这个Image对象的readyState属性问题,我在下面是这么判断的: if(ImgObj.readyState!="complete"){
setTimeout("CheckProperty(FileObj)",500);
return false;
}也就是说,如果readyState不是complete的话,会一直加载。为什么IE7Image对象的readyState属性永远都是uninitialized?
setTimeout("CheckProperty(FileObj)",500);
return false;
}也就是说,如果readyState不是complete的话,会一直加载。为什么IE7Image对象的readyState属性永远都是uninitialized?
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档 </title>
</head> <body>
<script type="text/javascript">
var imgSize = 1024 * 100; //最大100K
function checkImgSize(){
var file = document.getElementById("fuPhoto");
if(file.value != ""){
//检测类型
var val = file.value;
if(/^.*?\.(gif|png|jpg|JPG|JPEG|jpeg|bmp)$/.test(val)){
}else{
alert("只能上传gif, png, jpg, bmp格式的图片");
// return false;
}
var img = new Image();
img.onreadystatechange = function(){
if(img.readyState == "complete"){
if(img.fileSize <=0 || img.fileSize > imgSize){
alert("当前文件大小" + img.fileSize / 1024 + "KB, 超出最大限制 " + imgSize / 1024 + "KB");
}else{
alert("OK");
return true;
}
}
}
img.src = val;
}else{
alert("请选择上传的文件!");
return false;
}
}
</script>
<input type="file" id="fuPhoto" />
<input type="submit" value="上传" onclick="return checkImgSize()" />
</body>
</html>
function loadImage(url, callback) {
var img = new Image(); //创建一个Image对象,实现图片的预下载
img.src = url;
if (img.complete) { // 如果图片已经存在于浏览器缓存,直接调用回调函数
callback.call(img);
return; // 直接返回,不用再处理onload事件
} img.onload = function () { //图片下载完毕时异步调用callback函数。
callback.call(img);//将回调函数的this替换为Image对象
};
};
function checkimage(ImgObj,srcId,fileId)
{
//alert(fileId);
if(ImgObj.readyState!="complete") //如果图像是未加载完成进行循环检测
{
setTimeout("checkimage(ImgObj,"+srcId+",fileId)",500);
return false;
}var ImgFileSize=Math.round(ImgObj.fileSize/1024);
if (ImgFileSize<=10 || ImgFileSize>=1024)
{
alert("您上传的图片必须大于10K小于1024K.");
$("img"+srcId).src = "../../img pic.jpg";
var tt=$("FileUpload"+srcId);
tt.outerHTML="<input type='file' name=FileUpload"+srcId+" id=FileUpload"+srcId+" onpropertychange=createimg(this,"+srcId+") />";
return false;
}
else
{
$("img"+srcId).src=ImgObj.src;
}
}
function createimg(fileId,srcId)
{
ImgObj=new Image(); //建立一个图像对象
var imagefile=fileId;
ImgObj.src=imagefile.value;
checkimage(ImgObj,srcId,fileId);
}
我这里测试过了,用IE6什么问题都没有,IE7的问题是,首先是无法加载为“complete”,其次即使加载为“complete”,也不能每次都正确获取图片文件大小。有可能这次获取的大小是上一次的图片大小。真是一个很郁闷的问题!!!!!
img objects created using createElement fail to trigger the onreadystatechange event if the source file is already stored on the browser's cache. Only if the file is downloaded form the web server you can expect the event to fire up. This ocurrs on IE7, but it probably also happens in IE8. The bad news is that the onload event also has the same problem.
这是我在国外网站上找到的信息,有可能就是一个bug,还是尝试其它加载方法吧