layui在选择图片上传后,如果不F5刷新页面,第二次点击再次上传或者替换,会发现页面一点反应都没有,回调函数全部失效。
解决方法:
1-参考官方的文档:
链接地址
https://www.layui.com/doc/modules/upload.html#reload
2-具体代码
js代码:
//定义在外部的变量
//upload所需的options
var upload_info_obj;
//upload对象
var upload;
//用于判断的值
var sort=0;
//用于接收upload.render()返回的对象
var renderObj;
function doUpload_info() {
upload = layui.upload;
layui.use('upload', function () {
var $ = layui.jquery;
//拖拽上传
upload_info_obj= {
elem: '#iconUrlIdInfo'
, url: '/shopPic/uploadPic'
, done: function (data,index,upload) {
sort=1;
$("#picUrlInfo").val(data.data);
$('#iconUrlIdInfo').empty();
$('#iconUrlIdInfo').append('<img src="' + data.data + '" width="180px" height="180px" class="layui-upload-img">')
}
,error: function(e){
alert("请求异常"+e);
}
}
});
//接收upload.render()返回的对象
renderObj=upload.render(upload_info_obj);
}
function upload(){
if (sort == 1) {
//如果已选择过,那么需要重新加载-----重点在这!!!!
renderObj.reload(upload_info_obj);
}else{
//唤起上传控件
doUpload_info();
}
}
html(这里是随便写的,意思明白即可 关键还要看js):
<a href="javascript:upload()">上传</a>