HTML5 上传图片预览

html5出现之前如果需要上传图片预览 一般都是先上传到服务器然后远程预览

html5出现之后   有个filereader 解决了这问题

 //选中图片之后
            $("#fileAddPic").on('change', function (e) {
                var files = e.target.files || e.dataTransfer.files;
                onSelect(files);
            })


 //选中图片之后
 function onSelect(file) {
            file = file[0];

            var html = '', i = 0;
            $("#preview").html('<div class="upload_loading"></div>');
            var funAppendImage = function () {
                if (file) {
                    var reader = new FileReader();
                    reader.onload = function (e) {
                        $("#upimgBox").attr('src', e.target.result)
                    }
                    reader.readAsDataURL(file);
                }
            };
            funAppendImage();
        }

  

原文地址:https://www.cnblogs.com/sxmny/p/3998701.html