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 >'+
                        '![](__JHWIMAGES__/ewc.png)'+
                        '![]()'+
                    '</div>',$('.purchase_top').firstChild);
            })
        }
    });

Tags 标签

加个好友，技术交流