javascript - 如何手动触发 Dropzone 的点击（打开选择文件对话框）

Question

Dropzone 仅适用于元素本身，我的按钮内有一个 SPAN 标签，当我单击文本时，它不会触发单击 dropzone 附加到的父元素。我尝试了以下但它不起作用！

$('.dropzone').click();

还有这个

$('.dropzone').trigger('click');

Answer 1

默认情况下，dropzone 仅适用于它自身的元素，如果您尝试手动运行触发器，它将无法正常工作。在搜索了很多之后我能找到的最好方法是：

myDropzone.hiddenFileInput.click()

要立即找到 dropzone，有几种方法：

1- 通过 jquery：var myDropZone = $('.dropzone').get(0).dropzone;或者var myDropZone = $("div#dropmehere").dropzone({...});如果您使用 id 来查找您的元素

2- 通过 Dropzone 类本身：var myDropzone = Dropzone.forElement("div#dropmehere");

现在你可以

Answer 2

使用 vue dropzone 时，您可以使用以下行简单地打开文件对话框。

document.getElementsByClassName("dropzone")[0].click();

Answer 3

以下对我有用$('#dropzone_dropzone').get(0).dropzone.hiddenFileInput.click();

#dropzone_dropzone我的 DIV 的名称在哪里

Answer 4

在这里聚会已经很晚了，但是如果您正在寻找 vue2-dropzone 的解决方案（Dropzone.js 的 vue 包装器），您可以给 dropzone 一个参考（例如<vue-dropzone ref=dropzone />），然后调用$refs.dropzone.$el.click()以触发文件上传对话框.

Answer 5

看看这个解决方案，它工作正常。如果您使用的是 Angular，您可以按以下方式进行

  @ViewChild(DropzoneDirective) dropzoneRef: DropzoneDirective;

  

在你的方法中

this.dropzoneRef.dropzone().clickableElements[0].click();

Answer 6

在 5.7.2 版中，以下所有内容都对我有用：

$("#dropzone")[0].click()
$("#dropzone").get(0).click()
document.getElementById("dropzone").click();