dropzone.js - 以编程方式将现有文件添加到 Dropzone

Question

我正在尝试使用 dropzone.js FAQ 以编程方式将现有图像添加到我的 dropzone作为指南:

// Add the existing image if it's there.
// headerDropzone is my dropzone (debug shows it as existing and initialized at this point.
var on_load_header = $( '[name="on_load_header_image"]' ).val();
var on_load_header_path = $( '[name="on_load_header_image_path"]' ).val();

if ( on_load_header ) {

    // Hardcoded size value is just for testing, see my second question below.
    var on_load_header_data = { name: on_load_header, size: 12345 };

    // Call the default addedfile event handler
    headerDropzone.options.addedfile.call( headerDropzone, on_load_header_data );

    // And optionally show the thumbnail of the file:
    headerDropzone.options. thumbnail.call( headerDropzone, on_load_header_data, on_load_header_path);

}

我的第一个问题是这不起作用。 addedfile 事件不会触发(或者至少 headerDropzone 中的 addedfile 处理程序永远不会触发)，缩略图也是如此。

我的第二个问题/问题是:我必须提供文件大小吗？我可以在服务器端获得它，但如果我实际上不需要，我宁愿不这样做。

Answer 1

查看功能是否headerDropzone.options.addedfile和 headerDropzone.options.thumbnail实际上是定义的。它应该按照您的方式工作，但是如果没有更多信息，就很难判断出了什么问题。

关于文件大小:不，实际上没有必要提供准确的文件大小。只是 Dropzone 会自动显示文件大小。如果你不关心是否显示了一些错误的文件大小，那么你可以提供一些随机数或 0 .否则，您可能希望在添加文件后使用 CSS 或 JS 隐藏文件大小。 (有问题的元素具有类 dz-size 。

它的 JavaScript 版本看起来像这样:

var fileSizeElement = on_load_header_data.previewElement.querySelector(".dz-size");
fileSizeElement.parentNode.removeChild(fileSizeElement);