Question

我试图打印我上传的文件的名称但由于某种原因它只打印第一个文件。

该脚本允许我上传无限量的文件，这就是它的文件数组的原因。

<it.sephiroth.android.wheel.view.Wheel
            android:id="@+id/wheel"
            xmlns:sephiroth="http://schemas.android.com/apk/res-auto"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            sephiroth:numRotations="6"
            sephiroth:ticks="28" />

HTML

$(document).on('submit', 'form', function(e) {
    e.preventDefault(); 

    var $form = $(this);
    var act = 'add';

    var files = $form.find('.file-field').prop('files');
    var names = "";

    $.each(files,function(i, file){
        name = file.name;
        alert(name);
    });

});

Answer 1

prop()返回匹配元素集中第一个元素的属性值，或为每个匹配元素设置一个或多个属性。

取自 http://api.jquery.com/prop/

因此，使用each()迭代jQuery对象，并将其余部分视为相同的

$(document).on('submit', 'form', function(e) {
  e.preventDefault();

  var $form = $(this);
  var act = 'add';

  $form.find('.file-field').each(function() {
    var files = $(this).prop('files');
    var names = "";
    $.each(files, function(i, file) {
      var name = file.name;
      alert(name);
    });
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<form class="form-horizontal" action='#' method="post" enctype="multipart/form-data">
  <input type='file' name='file[]' class=' form-control file-field multi' maxlength='2' accept="image/jpg,image/png,image/jpeg,image/gif" id="uploadFile0" />
<input type='file' name='file[]' class=' form-control file-field multi' maxlength='2' accept="image/jpg,image/png,image/jpeg,image/gif" id="uploadFile0" />
  <button class="btn btn-primary submit">SEND</button>
</form>

更新：您可以简化代码

$(document).on('submit', 'form', function(e) {
  e.preventDefault();
  var $form = $(this);
  $form.find('.file-field').each(function() {
    var name = this.files[0].name;
    alert(name);
    console.log(name);
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<form class="form-horizontal" action='#' method="post" enctype="multipart/form-data">
  <input type='file' name='file[]' class=' form-control file-field multi' maxlength='2' accept="image/jpg,image/png,image/jpeg,image/gif" id="uploadFile0" />
<input type='file' name='file[]' class=' form-control file-field multi' maxlength='2' accept="image/jpg,image/png,image/jpeg,image/gif" id="uploadFile0" />
  <button class="btn btn-primary submit">SEND</button>
</form>

如何打印文件的名称

1 个答案: