javascript - 如何在多个文件输入中动态填充文件

Question

我正在使用 JavaScript 库 here选择多个图像并通过表单将它们保存在数据库中，当我编辑表单时，我从数据中获取图像并像这样填充。

<script>
var upload = new FileUploadWithPreview('myUniqueUploadId', {
            showDeleteButtonOnImages: true,
            text: {
                chooseFile: 'Įkelkite nuotrauką',
                browse: 'naršyti',
                selectedCount: 'Pasirinkti failai',
            },
            presetFiles: [
              <?php
              foreach($Workimages as $Workimg){
                echo $website_url.'master_image/'.$Workimg.','
              }
            ],
        })
   </script>

图像以Blob形式出现并正在填充，但是当我更新数据库中的数据时，旧图像将被忽略，但新选择的图像将被上传。我还检查了$_FILES['images']。它没有我的旧图像文件。

我还尝试使用方法 upload.cachedFilesArray.push 和 upload.addFiles() 但我没有成功。还有其他方法可以填充多个文件输入吗？

Answer 1

我是这个库的作者。

您似乎发现 PHP 服务器接受 Blob 类型存在问题。这可能是我以前从未遇到过的事情，因为我觉得我过去已经将 Blob 类型上传到我的 PHP 服务器 - 但也许我只是想象一些东西，它们一直是 File 类型，这就是为什么我从来没有遇到任何问题。

无论如何，为了让您的情况同时发挥作用，我做了一个简单的 codepen循环遍历 upload.cachedFileArray 数组并将每个 Blob (或 File)转换为 File 类型，并且将其附加到准备上传的新临时数组中。有关更多信息，请参阅代码笔中的评论。

此时，您只需上传新的临时数组即可。将来，我将确保所有 presetFiles 的类型为 File 而不是 Blob。