现在一般手机拍的照片都好几兆,图片文件太大会非常影响上传速度或者根本上传不上去,故上传图片前需要先进行压缩,这里使用的是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)})}})}}}
解决input file上传图片 部分手机拍照或者本地图片无法上传(图片太大 需要上传之前先压缩)