HTML5 上传图片预览

浏览数：19 / 时间：2015年06月09日

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 上传图片预览