UEditor上傳圖片後,展示的順序與選擇時順序不一致(多圖上傳)
阿新 • • 發佈:2019-02-16
UEditor多圖上傳時,由於後臺上傳介面返回的時間不同,會造成顯示上傳後的圖片與選擇時的圖片順序不一致的問題。
舉個栗子:
多圖上傳時,先後選擇了a.png和b.png,其中a.png大小為900k,b.png大小為5k,當上傳成功後點擊確認按鈕, 發現b.png在a.png前面。即選擇的時候順序為 a.png 、b.png,而上傳成功後顯示的順序為b.png 、 a.png ,因為a.png比b.png要大很多,後臺介面優先處理完畢並返回b.png,所以顯示順序發生了變化。
處理方法:
在以上位置,插入以下處理程式碼即可
// 對上傳成功後的圖片按照選擇的順序進行排序
var initImags = uploadImage.uploader.getFiles() // 獲取選擇的所有檔案
var sortedImgs = [] // 排序後的上傳成功檔案
for (var i = 0; i < initImags.length; i++) {
for (var j = 0; j < list.length; j++) {
if (list[j].title === initImgs[i].name && initImgs[i].flag != '1') {
sortedImgs.push(list[j])
initImgs[i].flag = '1'
}
}
}
list = sortedImgs
即:
具體處理的方法有很多種,initImgs[i].flag 的目的是為了防止圖片重名時造成的重複判斷