javascript - 通过单个按钮触发多个 Dropzone 上传

Question

我有一个简单的功能，用户可以提交他/她过去和当前项目的详细信息，并且我正在使用 dropzone，以便用户可以将相关文档上传到他们的项目。所以基本上，他们可以随心所欲地添加许多项目

目前，我将 dropzone 设置为 autoProcessQueue: true，这样当用户放置文件时，它会自动上传。

var dynamicDropzone = new Dropzone(element, {
        autoProcessQueue: true,
        addRemoveLinks: true,
        parallelUploads: 1,
        maxFilesize: 5,
        acceptedFiles: 'image/*,application/pdf',
        dictDefaultMessage: '<div class="dz-default dz-message"></div>',
        url: tempURL + 'upload.php',
        params: {
            'userID': current_user_id,
        },

我想要的是所有 dropzone 实例将开始在 1 个单按钮触发器中上传所有文件。

我的问题是，由于用户可以动态添加项目，因此单击按钮时拖放区不会触发上传

$("#button").click(function (e) {
    e.preventDefault();
    dynamicDropzone.processQueue();
});

button type="submit" id="button" class="btn btn-primary">Submit</button>

Answer 1

您需要保留autoProcessQueue: false，以便Dropzone在您删除文件时不会自动上传文件。

然后在单击按钮时，您需要告诉 Dropzone 实例像这样处理队列:

$("#button").click(function (e) {
    e.preventDefault();
    dynamicDropzone1.processQueue(); // process dropzone instance 1
    dynamicDropzone2.processQueue(); // process dropzone instance 2
});

这里已经有更详细的答案:https://stackoverflow.com/a/46732882/9354303