使用文件上传将数组中的单个字符串附加到列表项（li）？

Question

我正在尝试一次上传10个文件，并为所有这些文件的名称创建一个无序列表。在我尝试上传多个文件之前，它工作正常。

问题：我目前正在取回数组中所有小于1 li的字符串，但我希望以自己的li格式打印出每个文件上传的内容，因为正如您将在我的代码中看到的那样，我还将附加一个复选框，这意味着每个文件都需要自己的li。我不明白为什么它没有将每个文件打印到自己的位置。我的猜测是，它需要1个文件“上传”输入（可以并且可以保存1个以上的文件），并且就像是一次上传（尽管要上传1个以上的文件）。

这是我的代码。

        var fileList = [];
        for (var i = 0; i < e.target.files.length; i++) {
          fileList.push(e.target.files[i].name);
        }

        const formatedArray = fileList.map(x => {
          return x.replace(".pdf", "");
        });

        console.log(fileList);
        console.log(formatedArray);

        ul = document.createElement("ul");

        document.getElementById("uList").appendChild(ul);

        formatedArray.forEach(function(item) {
          let li = document.createElement("li");
          ul.appendChild(li);

          var checkbox = document.createElement("input");
          checkbox.type = "checkbox";
          checkbox.value = 1;
          checkbox.name = "todo[]";

          li.appendChild(checkbox);

          li.innerHTML += formatedArray;
        });
      };

Thanks in advance.

Answer 1

var fileList = [];for（var i = 0; i

    const formatedArray = fileList.map(x => {
      return x.replace(".pdf", "");
    });

    console.log(fileList);
    console.log(formatedArray);

    ul = document.createElement("ul");

    document.getElementById("uList").appendChild(ul);

    formatedArray.forEach(function(item) {
      let li = document.createElement("li");
      ul.appendChild(li);

      var checkbox = document.createElement("input");
      checkbox.type = "checkbox";
      checkbox.value = 1;
      checkbox.name = "todo[]";

      li.appendChild(checkbox);

      li.innerHTML += item;
    });
  };