首页 > 解决方案 > bootstrap-fileinput 逐个上传时只识别单个文件

问题描述

我正在使用引导文件输入,我已经像这样初始化它

code html*********

<div id="imgproyectos">
    <input id="input-fa-img-principal-detalle"
        name="inputfaimgprincipalDetalle" type="file" multiple
        class="file-loading">
</div>


              $("#input-fa-img-principal-detalle").fileinput('destroy');
              $("#input-fa-img-principal-detalle").fileinput({
                  initialPreview: '',
                  initialPreviewAsData: true,
                  //headers: {'X-CSRF-TOKEN': token },
                  theme: "fa",
                  previewFileType: "image",
                  allowedFileExtensions: ['jpg', 'jpeg', 'gif', 'png'],
                  browseClass: "btn btn-primary",
                  theme: "fa",
                  uploadUrl: "/file-upload-batch/2",
                  showUpload: false,
                  showRemove: false,
                  browseLabel: "Cargar Imagen",
                  removeClass: "btn btn-primary",
                  removeLabel: "Eliminar",
                  msgInvalidFileExtension: "Archivo de imagen no valido, solo estan permitidos formatos jpg , jpeg , gif , png "
              }).on("filebatchselected", function (event, files) {
                  //alert('xx');
                  $('.kv-file-upload').hide();
              });

使用这个 javascript 代码,我得到了我在 bootstrap-fileinput 中插入的图像

jQuery.each(jQuery('#input-fa-img-principal-detalle')[0].files, function(i, file) {
    //data.append('file-'+i, file);
    console.log('file-'+i, file);    
});

问题是当我批量加载图像时,它可以识别所有

在此处输入图像描述

但是当我开始逐个添加图像时,最后我从 3 个中运行我的 javascript 文件,只有 1 个图像文件可以识别我

在此处输入图像描述

有谁知道可能出了什么问题?

标签: javascriptjqueryhtmltwitter-bootstrapbootstrap-file-input

解决方案


试试这个是否可以解决错误您可以添加多个属性并将其值设置为多个以允许选择多个文件

<input type="file" id="myFile" name="myFile" multiple="multiple">

在你的情况下

 <input id="input-fa-img-principal-detalle"
    name="inputfaimgprincipalDetalle" type="file" multiple="multiple"
    class="file-loading">

推荐阅读