关于适配各种浏览器的图片预览。

最近被兼容性整的微微头大。

首先全局性的兼容性问题，就是文件上传及预览；

上传使用jquery fileupload，插件本身就适配了IE8以上的浏览器。demo地址：http://blueimp.github.io/jQuery-File-Upload/

本次要说的则是对上传前的图片预览问题；

l两种思路。（1），上传后返回路径进行展示 （2），上传前选择本地路径对其展示

 第一种方法实在是太浪费服务器资源了，pass掉；

然而第二种方案，就得考虑各个浏览器不同，本地预览图片的方法不同（兼容IE8以上 ，及主流浏览器）：

1，IE7和IE8下通过select获取file的图片路径，再用滤镜来显示预览。

（注：I6-I8习惯用filter滤镜来实现透明度，图片预览等效果，IE4-IE9支持filter属性，IE10就不在支持这个属性了）

2，FireFox下调用file的getAsDataURL方法获取Data URI数据来显示预览。

3，其他浏览器基本是可以通过getObjectURL获取数据，替换img的src来实现。

 

预览的三种情况。

（1）上传前选择图片的预览 （uploadPreview）

（2）一般本地图片预览 (picShow)

（3）上传失败返回默认图片预览(staticPic)

 

转载于:https://www.cnblogs.com/fnncat/p/6742720.html