Блог

У меня есть фрагмент кода, который working….it позволяет мне отображать несколько файлов в списке, когда пользователь нажимает «Выбрать файл». Код работает нормально. Тем не менее, я пытаюсь выяснить, можно ли добавлять в список вместо того, чтобы каждый раз создавать новый. Я исследовал это большую часть дня, и в подавляющем большинстве статей говорится, что это нелегко сделать. Должен ли я вместо этого использовать подход FormData? Купит ли это мне что-нибудь?

Вот мой код Javascript…Это прекрасно работает…

     window.onload = function() {
      const inputElement = document.getElementById("my_files");
      const fileNames = document.getElementById("file_names");
      let fileList = [];
    
      function removeFile(event) {
        event.preventDefault();
    
        let filename = this.dataset.filename;
        let modifiedFileList = new DataTransfer();
        for (let i = 0; i < fileList.length; i  ) {
          if (fileList[i].name !== filename) {
            modifiedFileList.items.add(fileList[i]);
          }
        }
    
        inputElement.files = modifiedFileList.files;
        fileList = inputElement.files;
        handleFiles(fileList);
        return false;
      }
    
      inputElement.addEventListener("change", handleFilesListener, false);
      function handleFilesListener() {
        fileList = this.files;
        handleFiles(fileList);
      }
    
      function handleFiles(fileList) {
        fileNames.textContent = '';
        for (let i = 0; i < fileList.length; i  ) {
          let listElement = document.createElement("li");
          let textNode = document.createTextNode(fileList[i].name);
    
          listElement.appendChild(textNode);
          listElement.setAttribute("class","attachmentname");
    
          let removeButton = document.createElement("button");
    
          removeButton.innerHTML = "Removeamp;nbsp";
          removeButton.setAttribute('type', 'button')
          removeButton.setAttribute("class", "button121");
          removeButton.setAttribute('data-filename', fileList[i].name)
          removeButton.addEventListener('click', removeFile)
          listElement.appendChild(removeButton);
          fileNames.appendChild(listElement);
        }
      }
    }
 

Опять же, я пытаюсь выяснить, могу ли я добавить в этот список вместо того, чтобы постоянно просматривать его, если список изменится. Я попытался сделать добавление вместо добавления ниже…но это не сработало. Я самопровозглашенный newb…so пожалуйста, полегче со мной. :).

 let filename = this.dataset.filename;
            let modifiedFileList = new DataTransfer();
            for (let i = 0; i < fileList.length; i  ) {
              if (fileList[i].name !== filename) {
                modifiedFileList.items.add(fileList[i]);
              }
            }
 

Заранее спасибо за любые указания.