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>