imgCompress.html

﻿<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>imgCompress</title>
    <style>
    </style>
</head>
<input type="file" id="file">
<img src="" alt="">
<img src="" id="img2">
<body>
    <script type="text/javascript" src="imgCompress.js"></script>
    <script>
        var input = document.querySelector("#file");
        var options = {
            isCompress: true,            //是否开启压缩
            sizeConstrained: 10240,//限制压缩大小(单位kb，可选)
            scale: 0.1,//压缩比例(范围0~1，可选)
            onSize: 500,//大于500kb启动压缩(可选)
            w_scale: 640,//宽度大于640px进行裁剪(可选)
            type: "image/jpeg",//文件类型(默认根据文件判断，可选)
            callbackFn: function (data) {
                //回调方法,包含一个参数,包含文件的一些详情(可选)
                console.log(data);
                document.querySelector("img").src = data.dataURL;       //压缩后
                document.querySelector("#img2").src = data.base64;       //压缩前
            }
        };
        new ImgCompress(input, options);
    </script>
</body>
</html>