html上传图片预览

<input type="file" name="filedata" accept="image/*" id='imageInput' onchange='loadImagesFile();'/>
<img src='' id='imgsrc' style="width:100%;"/>
<script>
var loadImagesFile = (function () {   
    if (window.FileReader) {   
        var oPreviewImg = null, oFReader = new window.FileReader(),   
            rFilter = /^(?:image\/bmp|image\/cis\-cod|image\/gif|image\/ief|image\/jpeg|image\/jpeg|image\/jpeg|image\/pipeg|image\/png|image\/svg\+xml|image\/tiff|image\/x\-cmu\-raster|image\/x\-cmx|image\/x\-icon|image\/x\-portable\-anymap|image\/x\-portable\-bitmap|image\/x\-portable\-graymap|image\/x\-portable\-pixmap|image\/x\-rgb|image\/x\-xbitmap|image\/x\-xpixmap|image\/x\-xwindowdump)$/i;   
              
              
            oFReader.onload = function (oFREvent) {
            $('#imgsrc').attr('src',oFREvent.target.result).css('display','');
        };   
              
              
        return function () {   
            var aFiles = document.getElementById("imageInput").files;   
            if (aFiles.length === 0) { return; }   
            if (!rFilter.test(aFiles[0].type)) { alert("你必须选择有效的图像文件!"); return; }   
            oFReader.readAsDataURL(aFiles[0]);   
        }    
    }   
})(); 
</script>