function add_dropzone() {
const drop_zone = document.createElement("form");
drop_zone.setAttribute("class","dropzone");
drop_zone.setAttribute("action","url_to_upload_files/");
drop_zone.setAttribute("id","my_dropzone");
//find a div where you want to add your dropzone
document.getElementById("div_for_dropzone").appendChild(drop_zone);
// this function will find the class="dropzone" tag and load it.
Dropzone.discover();
}
// Dropzone class:
var myDropzone = new Dropzone("div#myId", { url: "/file/post"});
您可能必须手动创建元素并设置某些属性。
var form = document.createElement('form');
form.classList.add('dropzone');
form.method = 'post';
form.action = '/file/post';
document.getElementById('parent').appendChild(form);
new Dropzone(form);
5条答案
按热度按时间yruzcnhs1#
只要确保在 * 新附加的元素 * 上调用插件。问题是插件只附加到最初存在的元素。
因此,在添加元素后再次调用插件,这样,它就被附加并再次工作。
rpppsulh2#
下面是我用来做同样事情的脚本。我已经通过使用 querySelector 更改了动态创建的输入类型文本的名称字段。querySelector 返回具有我使用的data-tagline自定义属性的元素的引用。
第一个
h22fl7wq3#
在脚本中,需要一个函数来创建dropzone的表单,然后执行函数
Dropzone.discover()
然后在html中添加一个div,其中包含
id="div_for_dropzone"
ffx8fchx4#
动态创建dz元素:
附加到div某处
启动示例
添加选项
ve7v8dk25#
有点晚了,但他们考虑了一下。正如文档的用法部分所述:
或者,您可以通过示例化Dropzone类以编程方式创建拖放区(即使在非表单元素上也是如此
您可能必须手动创建元素并设置某些属性。
如果不使用表单元素,请不要忘记指定url选项,因为如果没有action属性,Dropzone不知道要发布到哪里。