Dropzone - 多个实例获取 id答案

【问题标题】：Dropzone - multiple instances get idDropzone - 多个实例获取 id
【发布时间】：2017-08-18 08:45:10
【问题描述】：

我有多个 dropzone 表单

 <form action="/upload" class="dropzone" id="group1"></form>
 <form action="/upload" class="dropzone" id="group2"></form>
 <form action="/upload" class="dropzone" id="group3"></form>

如何获取文件所在表单的 ID？

【问题讨论】：

标签： forms multiple-instances dropzone

【解决方案1】：

要像添加文件那样挂钩 Dropzone 操作，您需要使用事件处理程序。 From the docs:

Dropzone 在处理文件时触发事件，您可以通过在您的实例上调用 .on(eventName, callbackFunction) 轻松注册到该事件。

因此，您需要手动实例化您的 Dropzone，才能访问该实例。

如果您使用的是 jQuery：

// Don't automatically instantiate, we'll do it manually
Dropzone.autoDiscover = false;

// Using the jQuery syntax shown in the docs    
$("#group1, #group2, #group3").dropzone({
    init: function() {
        var formID = this.element.attributes.id;
        this.on("addedfile", function(file) {
            console.log('Image dropped on form ID', formID);
        });
    }
});

如果你不使用 jQuery：

Dropzone.autoDiscover = false;

var dz = [],
    forms = document.getElementsByTagName('form');

for (var i = 0; i < forms.length; i++) {
    dz[i] = new Dropzone(forms[i], {
        init: function() {
            var formID = this.element.attributes.id;
            this.on("addedfile", function(file) {
                console.log('Image dropped on form', formID);
            });
        }
    });
}

【讨论】：