ie8 pdf转html5,【前端】如何在IE8上兼容filereader对象

最新推荐文章于 2025-03-23 22:30:07 发布

Macrko

最新推荐文章于 2025-03-23 22:30:07 发布

阅读量369

点赞数 1

文章标签： ie8 pdf转html5

在不支持fileReader对象的IE8浏览器中实现图片上传预览，可以通过检测浏览器版本，提示升级或使用IE的滤镜技术。当input[type=file]改变时，若为低版本IE，则应用滤镜JS实现预览；对于高版本浏览器，可以利用window.URL.createObjectURL进行预览。此方法在保证预览效果的同时，避免频繁向后台发送请求。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

如题，本人想实现一个图片上传之前的预览效果，明白可以用fileReader对象来实现,但是IE8上却不支持,请问有什么兼容性的方案吗？

目前我有两种想法,一种是检测浏览器的版本,如果版本过低的话,就提示用户升级浏览器,但这是万不得已的做法,还有一种方案就是上传图片时,一旦input[type=file]里的内容发生变化,就直接把图片传给后台,然后后台把该图片在服务器上的src地址返回给我,我把这个src插进img标签内,实现一个预览效果,但我感觉这样向后台发送请求太频繁了,用户都还没上传图片只是预览一下，我却要像后台发送请求。。

请问还有什么更好的解决方案吗？

谢谢！

回答

IE 10+ ，预览功能用 window.URL.createObjectURL ，低版本用IE 的滤镜

js图片上传预览

function PreviewImage(imgFile)

{

var filextension=imgFile.value.substring(imgFile.value.lastIndexOf("."),imgFile.value.length);

filextension=filextension.toLowerCase();

if ((filextension!='.jpg')&&(filextension!='.gif')&&(filextension!='.jpeg')&&(filextension!='.png')&&(filextension!='.bmp'))

{

alert("对不起，系统仅支持标准格式的照片，请您调整格式后重新上传，谢谢 !");

imgFile.focus();

}

else

{

var path;

if(document.all)//IE

{

imgFile.select();

path = document.selection.createRange().text;

document.getElementById("imgPreview").innerHTML="";

document.getElementById("imgPreview").style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled='true',sizingMethod='scale',src=\"" + path + "\")";//使用滤镜效果

}

else//FF

{

path=window.URL.createObjectURL(imgFile.files[0]);// FF 7.0以上

//path = imgFile.files[0].getAsDataURL();// FF 3.0

document.getElementById("imgPreview").innerHTML = " %22+path+%22 ";

//document.getElementById("img1").src = path;

}