我正在使用krajee fileiput js通过uploadAsync : true,
进行多次上传。我的问题是,成功上传后,文件指示器上的单个图标会显示一小段时间,然后将其删除。但在原始样本中将保留。
下面是我启动文件输入的代码
$("#documents").fileinput({
showUpload: true,
uploadAsync : true,
uploadLabel : 'Upload All Files',
layoutTemplates: {
main1: "{preview}\n" +
"<div class=\'input-group {class}\'>\n" +
" <div class=\'input-group-btn\'>\n" +
" {browse}\n" +
" {upload}\n" +
" {remove}\n" +
" </div>\n" +
" {caption}\n" +
"</div>"
},
fileActionSettings : {
removeIcon : '<i class="glyphicon glyphicon-trash"></i>',
uploadIcon : '<i class="fa fa-upload"></i> ',
zoomIcon : '<i class="fa fa-arrows-alt"></i>',
indicatorNew : '<i class="icon-spam"></i> ',
indicatorSuccess: '<i class="glyphicon glyphicon-ok-sign text-success"></i>',
showDrag : false,
showRemove : false,
},
previewZoomButtonIcons : {
prev: '<i class="fa fa-chevron-left"></i>',
next: '<i class="fa fa-chevron-right"></i>',
toggleheader: '<i class="fa fa-arrows-v"></i>',
fullscreen: '<i class="icon-screen-full"></i>',
borderless: '<i class="glyphicon glyphicon-resize-full"></i>',
close: '<i class=" glyphicon glyphicon-remove"></i>'
},
allowedPreviewTypes : ['image'],
preferIconicPreview : true,
previewFileIcon : '<i class="fa fa-file text-danger"></i>',
previewFileIconSettings: {
'doc': '<i class="fa fa-file-word-o text-primary"></i>',
'xls': '<i class="fa fa-file-excel-o text-success"></i>',
'ppt': '<i class="fa fa-file-powerpoint-o text-danger"></i>',
'jpg': '<i class="fa fa-file-photo-o text-warning"></i>',
'pdf': '<i class="fa fa-file-pdf-o text-danger"></i>',
'zip': '<i class="fa fa-file-archive-o text-muted"></i>',
'xml': '<i class="fa fa-file-code-o text-muted"></i>',
},
previewFileExtSettings: {
'doc': function(ext) {
return ext.match(/(doc|docx)$/i);
},
'xls': function(ext) {
return ext.match(/(xls|xlsx)$/i);
},
'ppt': function(ext) {
return ext.match(/(ppt|pptx)$/i);
},
'jpg': function(ext) {
return ext.match(/(jpg|gif|png|jpeg|bmp)$/i);
},
'pdf': function(ext) {
return ext.match(/(pdf)$/i);
}
},
overwriteInitial : false,
initialPreviewShowDelete : true,
initialPreviewDownloadUrl : '',
initialPreviewAsData: false,
uploadUrl : 'upload_url',
uploadExtraData : { "_token" : csrf_token},
slugCallback: function(filename) {
return filename.replace('(', '_');
},
deleteExtraData : {
"_token" : csrf_token
}
}).on('fileuploaded', function() {
console.log('upload success');
});```
[![Original sample][1]][1]
[![my upload][2]][2]
[1]: https://i.stack.imgur.com/zOL3U.gif
[2]: https://i.stack.imgur.com/HcRPQ.gif