JavaScript 实现单图片上传实时预览

 

<div class="col-sm-6" >
   <input type="file" name="thumb" onchange="showPreview(this,false)">
   <img id="portrait" src="" style="display:none;"  width="120" height="60"/>
</div>

function showPreview(source,type) {

 var file = source.files[0];
 if(window.FileReader) {
    var fr = new FileReader();
                    
    var portrait = document.getElementById('portrait');
    fr.onloadend = function(e) {
        portrait.src = e.target.result;
    };
    fr.readAsDataURL(file);
    portrait.style.display = 'block';
 }


}