现在一般手机拍的照片都好几兆,图片文件太大会非常影响上传速度或者根本上传不上去,故上传图片前需要先进行压缩,这里使用的是lrz.js(lrz.js文件这里就不提供了)
<input type="file" style="display: none;" id="unloadBtn" accept="image/*" onchange="getImg(this)">
<a href="javascript:;" onclick="uploadImg()" id="result">
<img src="images/uploading.png">
<span id="resultImg" style="display: none;"></span>
</a>
// 点击上传图片
function uploadImg() {
$("#unloadBtn").click()
}
function getImg() {
layer.open({
type: 2
, content: '正在上传'
})
var file = document.getElementById("unloadBtn").files;
var result = document.getElementById("result");
for (i = 0; i < file.length; i++) {
alert("d")
var reader = new FileReader();
reader.readAsDataURL(file[i]);
reader.onload = function (e) {
alert("压缩前base64长度:" + e.target.result.length);
lrz(e.target.result, {
width: 1000,
height: 500,
before: function () {
alert('压缩开始');
},
fail: function (err) {
alert(err);
},
always: function () {
alert('压缩结束');
},
done: function (results) {
var data = results.base64;
alert("编码后base64长度:" + data.length);
$.post(url + "file.ashx?m=base64&width=1000&height=500", {
base64: data
}, res => {
layer.closeAll('loading');
$("#result img").attr("src", data).addClass("resultImg")
$("#resultImg").html(data)
})
}
})
}
}
}