layui 版本为 2.6.8。
主要关键在 choose
回调那。懒得看源码了,就用uploadFiles = obj.pushFile();
获取上传的文件吧。
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label"><span style="color:red">* </span>上传模板</label>
<div class="layui-input-inline">
<button class="layui-btn" id="podaFile" name="podaFile" type="button">选择文件</button>
</div>
</div>
</div>
<div class="layui-layer-btn">
<button class="layui-btn" id="uploadFileBtn2" type="button">开始上传</button>
<input class="layui-btn" id="uploadFileBtn" type="hidden">
</div>
let uploadFiles = {};
upload.render({
elem: '#podaFile',
url: '你的 url',
auto: false,
field: "odaFile",
accept: "file",
exts: "xlsx",
//multiple: true,
bindAction: '#uploadFileBtn',
// data: {},
choose: function(obj){
uploadFiles = obj.pushFile();
// 清空,防止多次上传
for (let k in uploadFiles) {
delete uploadFiles[k];
}
obj.preview(function(index, file, result){
obj.pushFile();// 再添加
let fileBox = $('#podaFile').parent();
fileBox.find('.layui-upload-choose').remove();
fileBox.append(`<span class="layui-inline layui-upload-choose">${file.name}</span>`);
});
},
before: function (obj) {
layer.load();
},
done: function (res) {
layer.closeAll('loading');
if (res.code == 601) {
layer.alert('验证失败,点击确定查看原因', {icon: 2});
} else if (res.code == 200) {
// 清除文件
let fileBox = $('#podaFile').parent();
fileBox.find('.layui-upload-choose').remove();
$('#podaFile').val('');
}else {
layer.alert(res.msg, {icon: 2});
}
},
error: function (index, upload) {
layer.closeAll('loading');
}
});
$('#uploadFileBtn2').on('click', e => {
if (Object.keys(uploadFiles).length > 0) {
$('#uploadFileBtn').click();
} else {
layer.alert('请选择文件再上传!', {icon: 2})
}
});
网友评论