js基于canvas制作图片压缩预览保存打压缩包功能

js基于canvas制作图片压缩预览保存打压缩包功能，可设置jpg图片压缩比例和图片最大宽度，支持用jszip打压缩包下载。

分类：图片代码 > 缩略图难易：中级

查看演示下载资源下载积分： 30 积分

js代码

<script type="text/javascript" src="jszip/jszip.min.js"></script>
<script type="text/javascript" src="jszip/FileSaver.js"></script>
<script type="text/javascript" src="js/JCompressor.js"></script>
<script>
			document.getElementById("fileinput").addEventListener("change",inputchange)
			function inputchange(_this){
				var _this = this;
				var quality = document.getElementById("quality").value;
				var maxWidth = document.getElementById("maxwidth").value;
				var loadingDom = document.getElementById("loading");
				JCompressor(_this, {
					Quality: Number(quality),
					MaxWidth: Number(maxWidth),
					PreviewContainer: "imgbox",
					FileLoad: function(filedata) {
						_this.value = "";
					},
					NeedDownload:true,
					DownloadLoad:function(nextfn){
						var btnDom = document.getElementById("downloadBtn");
						btnDom.style.color = "blue";
						btnDom.style.borderColor = "blue";
						btnDom.onclick = function() {
							nextfn();
							btnDom.onclick = null;
							btnDom.style.color = "";
							btnDom.style.borderColor = "";
						}
					},
					ChangeBefore:function(){
						loadingDom.innerHTML = "处理中······";
					},
					ChangeAfter:function(){
						loadingDom.innerHTML = "";
					}
				})
			} 
</script>