ie8测试始终不支持，非ie方法一、二都正常
<!DOCTYPE html>
<html lang="zh"> <head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>Document</title>
<style type="text/css">
img {
width: 200px;
height: 100px;
}
.m-top{
margin-top: 10px;
}
</style>
<script type="text/javascript">
function PreviewImage(file) {
var filextension = file.value.substring(file.value.lastIndexOf("."), file.value.length);
filextension = filextension.toLowerCase();
if((filextension != '.jpg') && (filextension != '.gif') && (filextension != '.jpeg') && (filextension != '.png') && (filextension != '.bmp')) {
alert("对不起，系统仅支持标准格式的照片，请您调整格式后重新上传，谢谢 !");
file.focus();
} else {
var url;
if (file.files && file.files[0]){
/*
// 方法一：FileReader API实现本地图片预览
var file = file.files[0];
//创建一个FileReader对象
var reader = new FileReader();
//读取file文件；
reader.readAsDataURL(file);
//当文件读取成功后，将结果保存到url变量里；
reader.onload = function(evt) {
url = evt.target.result;
document.getElementById('img').src = url;
}
*/
//url = file.files[0].getAsDataURL();// FF 3.0
//document.getElementById("img").src = url; // 方法二：HTML5 URL API
url=window.URL.createObjectURL(file.files[0]);// FF 7.0以上
document.getElementById("imgPreview").innerHTML = "<img id='img' src='"+url+"'/>"; } else {
// 兼容IE9及以下
//获取上传文件控件的值；
file.select();
url = document.selection.createRange().text;
document.getElementById("imgPreview").innerHTML="";
document.getElementById("imgPreview").style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled='true',sizingMethod='scale',src=\"" + url + "\")";//使用滤镜效果
}
}
}
</script>
</head> <body>
<input id="fileItem" type="file" onchange='PreviewImage(this)' />
<div id="imgPreview" class="m-top" style='width:200px; height:100px;'>
<img src="" id="img" alt="pic" />
</div>
</body> </html>