首页 > 代码库 > HTML5 上传图片预览

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();        }

  

HTML5 上传图片预览