主页 / 问题 / 851703
Accepted
Алексей
Asked:2020-07-08 18:55:10 +0000 UTC2020-07-08 18:55:10 +0000 UTC

从表单中形成数据以通过 AJAX 提交

  • 772

有一个表格

<form id="upload-docs" name="uploadDocs">
  <div class="field-upload">
    <label for="file1">Файл1:</label>
    <input id="file1" name="file1" type="file" accept=".xlsx,.xls,image/*,.doc, .docx,.ppt, .pptx,.txt,.pdf">
  </div>
  <div class="field-upload">
    <label for="file2">Файл 2:</label>
    <input id="file2" name="file2" type="file" accept=".xlsx,.xls,image/*,.doc, .docx,.ppt, .pptx,.txt,.pdf">
  </div>
  <input type="submit" value="Загрузить файлы">
</form>

我正在尝试收集这样的数据

$('#upload-docs').on('submit', function(event){
  event.preventDefault();
  let formData = new FormData(document.forms.uploadDocs);
});

但变量formData仍然为空。我在哪里计算错了，或者我可以以其他方式从表单中收集数据吗？

javascript

1 个回答

  1. Best Answer

    我在哪里计算错了，或者我可以以其他方式从表单中收集数据吗？

    这就是收集文件的方式。

    $('#upload-docs').on('submit', function(event) {
  event.preventDefault();
  var formData = new FormData();
  //----------------------------------------------------------------
  // Вот так файлы ловят
  formData.append("file1", $('#file1').prop('files')[0]);
  formData.append("file2", $('#file2').prop('files')[0]);
  //----------------------------------------------------------------
  
  // Debbug output
  console.log($('#file2').prop('files')[0],
    $('#file2').prop('files')[0]);
    
  // Распечатка того, что есть в formData
  for (var pair of formData.entries()) {
    console.info(pair[0] + ', ' + pair[1]);
  }

});
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form id="upload-docs" name="uploadDocs">
  <div class="field-upload">
    <label for="file1">Файл1:</label>
    <input id="file1" name="file1" type="file" accept=".xlsx,.xls,image/*,.doc, .docx,.ppt, .pptx,.txt,.pdf">
  </div>
  <div class="field-upload">
    <label for="file2">Файл 2:</label>
    <input id="file2" name="file2" type="file" accept=".xlsx,.xls,image/*,.doc, .docx,.ppt, .pptx,.txt,.pdf">
  </div>
  <input type="submit" value="Загрузить файлы">
</form>

    博士。FormData.append

    • 3

相关问题