关于html5:js多图片上传获取多个图片base64的值显示到页面

上传前显示成果

上传后显示成果


$('#img_purchase').on('click',function(){  
    $('#purchase').click();  
}); 
$('#img_sale').on('click',function(){  
    $('#sale').click();  
}); 

function getBase64 (file,Callback) {
    let reader = new FileReader()
      let imgResult = ''
      reader.readAsDataURL(file)
      reader.onload = function () {
        imgResult = reader.result
      }
      reader.onerror = function (error) {
        Callback(error)
      }
        reader.onloadend = function () {
        Callback(imgResult)
      }
};

    $(document).on('change', '#purchase', function () {
        var filePath = $(this).val()
        console.log(filePath);
        var arr_prepath=this.files;
        console.log(arr_prepath);
        for (var i=0;i<arr_prepath.length;i++){
            getBase64(arr_prepath[i],function(res){
        console.log(res);
                $('.img_addpurchase').before('<div class="le_img">'+
                        '![](__JHWIMAGES__/ewc.png)'+
                        '![]()'+
                    '</div>',$('.purchase_top').firstChild);
            })
        }
    });

评论

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

这个站点使用 Akismet 来减少垃圾评论。了解你的评论数据如何被处理