本文介绍了一种基于JavaScript的图片上传及即时预览功能实现方案。通过判断浏览器对FileReader接口的支持情况，分别处理现代浏览器与IE6等旧版浏览器的文件读取逻辑，实现图片选择后的本地路径获取与标签src属性动态更新，从而在页面中即时展示上传的图片效果。
JavaScript实现图片上传与即时预览功能
本文通过一个具体实例，详细讲解了利用JavaScript实现图片上传并即时预览的功能，旨在为相关开发者提供参考与借鉴。
该功能参考了网络上的部分代码思路，整合开发出了一套能够实时处理图片上传并展示预览效果的解决方案。
<img id="imgTag" style="height: 100px;" alt="" />
<input type="file" />
function DisplayImage(fileTag,imgTagId){
var allowExtention=".jpg.png.gif";
var extentionArr=fileTag.value.split('.');
var extention = extentionArr[extentionArr.length-1];
if(!(allowExtention.indexOf(extention)>-1)){
alert("Please upload image!");
}else{
//for adveced broswer(the newest ie,chrome,ff)
if(typeof(FileReader)!=="undefined"){
var reader = new FileReader();
reader.readAsDataURL(fileTag.files[0]);
reader.onload = function(e){
document.getElementById(imgTagId).setAttribute("src", e.target.result);
}
}else{
//for(ie6)
document.getElementById(imgTagId).setAttribute("src",fileTag.value);
}
}
}期望本文提供的技术方案能对从事JavaScript程序设计的读者在实际开发中有所帮助。