使用FileReader将图像编码为base64字符串上传后结果只显示图

chenyajun 2022-10-16 13:41:17 阅读 1794 次评论 0 条

<!DOCTYPE html>    <html lang="en">    <head>    <meta charset="UTF-8">    <title>Document</title>    </head>    <body>    <input type="file" ><br>    <img src="" height="200" alt="Image preview...">    <script>    
        var file = document.querySelector('input[type=file]');    
        var img = document.querySelector('img');    
        file.onchange = function(){    
            var fr = new FileReader();    
            fr.onload = function(){    
                img.src = fr.result;    
            }    
            if (file.files[0]){    
                fr.readAsDataURL(file.files[0])    
            }    
        }    
    </script>    </body>    </html>

本文地址：https://chenyajun.net/index.php/post/97.html
版权声明：本文为原创文章，版权归 chenyajun 所有，欢迎分享本文，转载请保留出处！