Javascript 单个页面中的多个 Dropzone
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/26657489/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Multiple Dropzone in a single page
提问by mekafe
I'm using Dropzone without creating a dropzone form. It works great for me in this way.
我正在使用 Dropzone 而不创建 dropzone 表单。它以这种方式对我很有用。
But in this case I can not create another instance of Dropzone in my page.
但在这种情况下,我无法在我的页面中创建另一个 Dropzone 实例。
var myDropzone1 = new Dropzone(
document.body,
{
url : "upload1"...
.
.
. some parameters
};
var myDropzone2 = new Dropzone(
document.body,
{
url : "upload'"...
.
.
. some parameters
};
When I do this, I'm getting the error Dropzone already attached.
当我这样做时,我收到错误 Dropzone already attached.
回答by lin
It's possible, but you can't bind a second dropdzone on the same element, as you did. 2 Dropzones on one element makes no sense. 2x document.body in your solution atm. Try this...
这是可能的,但是您不能像以前那样在同一元素上绑定第二个 dropdzone。2 Dropzones 在一个元素上是没有意义的。解决方案 atm 中的 2x document.body。尝试这个...
HTML:
HTML:
<form action="/file-upload" class="dropzone" id="a-form-element"></form>
<form action="/file-upload" class="dropzone" id="an-other-form-element"></form>
JavaScript:
JavaScript:
var myDropzoneTheFirst = new Dropzone(
//id of drop zone element 1
'#a-form-element', {
url : "uploadUrl/1"
}
);
var myDropzoneTheSecond = new Dropzone(
//id of drop zone element 2
'#an-other-form-element', {
url : "uploadUrl/2"
}
);
回答by Antony
I want to add something here because I have experienced problems with multiple dropzones on the same page.
我想在这里添加一些东西,因为我在同一页面上遇到了多个放置区的问题。
In your init code you must rememberto include var if putting a reference otherwise it isn't dealing with this instance of the dropzone rather trying to access/relate to the others.
在您的 init 代码中,您必须记住在放置引用时包含 var,否则它不会处理 dropzone 的这个实例,而是试图访问/关联到其他实例。
Simple javascript but makes a big difference.
简单的javascript,但有很大的不同。
init: function(){
var dzClosure = this;
$('#Btn').on('click',function(e) {
dzClosure.processQueue();
});

