• 前端压缩图片转base64


    <!DOCTYPE html>
    <html lang="zh-CN">
    <head>
        <title>image-test</title>
        <meta charset="utf-8"/>
        <script src="jquery-2.1.4.js" type="text/javascript"></script>
        <script src="base64image.js" type="text/javascript"></script>
        <script src="exif.js" type="text/javascript"></script>  
    </head>
    <body>
    <input type="file" style="display: none" onchange="fileUp(this)" id="file-up">
    <input type="button" value="点我上传图片"  onclick="$('#file-up').click();" />
    <div id='image-list'>
    </div>
        <script>
            var fileUp = function (me) {
                base64Image({
                    file: me,                              /*【必填】对应的上传元素 */
                    callback: function (imageUrl) {        /*【必填】处理成功后的回调函数 */
                        /*imageUrl为得到的图片base64数据,这里可以进行上传到服务器或者其他逻辑操作 */
                        var img = new Image();
                        img.src = imageUrl;
                        $("#image-list").append(img);       
                    },
                    750,                          /*【选填】宽度默认750,如果图片尺寸大于该宽度,图片将被设置为该宽度*/
                    ratio:0.75,                         /*【选填】压缩率默认0.75 */
                });
            };
        </script>
    </body>
    </html>
    

    base64image.js

    链接:https://pan.baidu.com/s/1tphkGaJR2L9YZpXBn_B1Dw
    提取码:1jm0 

    exif.js

    链接:https://pan.baidu.com/s/1fbC4aqfg9ZFWguyHXW8lrQ
    提取码:51n2
    复制这段内容后打开百度网盘手机App,操作更方便哦

     
  • 相关阅读:
    利用Expression实现DbReader到对象属性的绑定
    致多年后第一次更新
    阿拉伯数字转换成中文大写
    Android程序的入口点是什么,不是Main()吗
    imageButton 和button的区别
    对象和引用的区别
    hdu 4455 Substrings
    Running Rabbits
    ZOJ Problem Set
    几乎就是并查集 (Almost Union-Find,UVa 11987)
  • 原文地址:https://www.cnblogs.com/dawnzhao/p/14148386.html
Copyright © 2020-2023  润新知