您的位置:首页 > Web前端 > JavaScript

js 实现图片预览功能支持ie8

2016-11-16 14:00 706 查看
function uploadImage (upload) {
//初始化文件
var file;
if(upload.files){
var len = upload.files.length
for (var i = 0;i<len;i++) {
file = upload.files[i];
var Reader = new FileReader();
Reader.readAsDataURL(file);
Reader.onload = function(){
$(upload).next(".pos-img").attr("src",Reader.result);
}
}
}else{
var pic = $(upload).next(".pos-img").get(0),
file = upload;
var ext=file.value.substring(file.value.lastIndexOf(".")+1).toLowerCase();
// gif在IE浏览器暂时无法显示
if(ext!='png'&&ext!='jpg'&&ext!='jpeg'){
alert("图片的格式必须为png或者jpg或者jpeg格式!");
return;
}
var isIE = navigator.userAgent.match(/MSIE/)!= null,
isIE6 = navigator.userAgent.match(/MSIE 6.0/)!= null;
if(isIE) {
file.select();
var reallocalpath = document.selection.createRange().text;
// IE6浏览器设置img的src为本地路径可以直接显示图片
if (isIE6) {
pic.src = reallocalpath;
}else {
// 非IE6版本的IE由于安全问题直接设置img的src无法显示本地图片,但是可以通过滤镜来实现
pic.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod='scale',src=\"" + reallocalpath + "\")";
// 设置img的src为base64编码的透明图片 取消显示浏览器默认图片
pic.src = 'data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==';
}
}
}
}


<input type="file" class="form-control form_file" name="party_pic_file" onchange="uploadImage(this)"/>
<img class="pos-img " src="${pic_path}/${model.party_pic}" alt="上传图片" onerror="javascript:this.src='${ctx }/static/images/wdj/uploadImg.png'"/>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: