| 以文本方式查看主题 - Foxtable(狐表) (http://foxtable.net/bbs/index.asp) -- 专家坐堂 (http://foxtable.net/bbs/list.asp?boardid=2) ---- 前端压缩 (http://foxtable.net/bbs/dispbbs.asp?boardid=2&id=172303) |
| -- 作者：刘林 -- 发布时间：2021/10/7 17:22:00 -- 前端压缩 <script>
var $ = layui.$
var up = layui.upload;
up.render({
elem: \'#open\',
multiple: true,
url: \'../sc\',
auto: false, //绑定了上传按键时要设自动上传为false
choose: function(obj) {
obj.preview(function(index, file, result) {
$(\'#wdzp img\').attr("src", result);
})
},
// choose: function (obj) {
// obj.preview(function (index, file, result) {
//
$(\'#wdzp img\').attr("src", result);
// newfile = new ImageCompressor(file, {
// quality: 0.6,
// maxWidth: 150,
// maxHeight: 200,
// success(result) {
// obj.resetFile(index, result, file.name);
// },
// });
// });
// },
bindAction: \'#upload\', //绑定上传按皱键
before: function() {
layer.load()
}, //打开上传提示弹层
allDone: function(obj) {
if (obj.aborted) {
$(\'#upload-cc\').removeClass(\'layui-hide\')
} else {
$(\'#upload-cc\').addClass(\'layui-hide\')
}
layer.closeAll()
}, //关闭上传提示弹层
error: function(index, upload) {
$(\'#upload\').click(function() {
upload()
})
} //关上传出错时给重传绑定upload事件
})
</script> 请问老师: 用layui 框架，jquer上传图片时想前端压缩后上传，红色部分想用注释掉的来改但不行，请问怎么改才行
|
| -- 作者：有点蓝 -- 发布时间：2021/10/7 17:28:00 -- layui没用过，提供完整可测试的实例试试。 |
| -- 作者：刘林 -- 发布时间：2021/10/7 21:30:00 -- https://www.zhangxinxu.com/study/201707/js-compress-image-before-upload.html找到一个例子，基础差，还是变通不来, 如何将打开文件得到result压缩再填到预览中，请帮研究下，谢谢 |
| -- 作者：有点蓝 -- 发布时间：2021/10/7 22:11:00 -- 就是给文件上传控件绑定change事件，看最后的【eleFile.addEventListener】，在选择文件后就会触发这个事件，事件里【reader.readAsDataURL】就会触发【img.onload】函数开始压缩和上传。 链接里基本每行都有说明了，如果具体内容还是不懂的，再搜索咯，比如：https://developer.mozilla.org/zh-CN/docs/Web/API/FileReader/readAsDataURL
|