zoukankan      html  css  js  c++  java
  • js上传图片,js图片转换为Base64

    <!DOCTYPE html>
    <html>
    
        <head>
            <meta charset="UTF-8">
            <title></title>
        </head>
        <body>
            <input type="file" id="fileimg" />
            <img src="" id="viewimg" />
        </body>
    
    </html>
    <script type="text/javascript" src="js/jquery.min.js"></script>
    <script>
        //file选项改变时
        $("#fileimg").change(function() {
            //把选择的图片显示到img上
            var fileObj = $(this)[0];
            var windowURL = window.URL || window.webkitURL;
            var dataURL;
            var $img = $("#viewimg");
            if(fileObj && fileObj.files && fileObj.files[0]) {
                dataURL = windowURL.createObjectURL(fileObj.files[0]);//要显示图片的路径
                $img.attr("src", dataURL);//显示图片
                //图片转换成base64
                var reader = new FileReader();
                reader.readAsDataURL(this.files[0]);//这一步是关键
                reader.onload = function (e){
                    var base64=e.target.result;//这一步是关键
                    alert(base64);
                    $.ajax({
                        type:"post",
                        url:"......",
                        data:{base64:base64},//base64:e.target.result
                        async:true,
                        dataType:"json"
                    });
                }
            }
        })
    </script>
     
  • 相关阅读:
    计算机网络七:中继器、集线器、交换机、路由器、网桥和网关
    vue 简易计算器
    express mongodb 连接池
    vue过度动画
    Webpack 学习笔记(0)
    git 学习笔记
    MySQL 权限笔记
    java gui笔记
    3d tranform css3
    java 多线程笔记
  • 原文地址:https://www.cnblogs.com/kcjm/p/7442896.html
Copyright © 2011-2022 走看看