单页上的多个放置区，第二个表单不显示上传文本答案

【问题标题】：Multiple dropzone on single page, second form does not shows upload text单页上的多个放置区，第二个表单不显示上传文本
【发布时间】：2021-12-12 21:20:38
【问题描述】：

我正在尝试将两个 dropzone 表单放在一个页面上，并且上传、显示、删除等所有功能都可以正常工作，但第二个表单不显示“将文件拖放到此处”文本。

我想为每个表单设置不同的文本，例如“将图像放在此处”和“将文档放在此处”。我怎样才能做到这一点？

我的代码如下所示：

html:

<div class="first">
  <div class="inner">
    <form class="dropzone" id="mydropzone" action="up.php"></form>
  </div>
</div>
<div class="second">
  <div class="inner">
    <form class="dropzone2" id="mydropzone2" action="up2.php"></form>
  </div>
</div>
<script>
Dropzone.autoDiscover = false;
Dropzone.options.mydropzone = {
   dictDefaultMessage: "my custom text one!"
};
$(".dropzone").dropzone({
  //dropzone stuff here like show already uploaded files, delete, etc...
});

Dropzone.options.mydropzone2 = {
   dictDefaultMessage: "my custom text two!"
};
$(".dropzone2").dropzone({
  //dropzone stuff here like show already uploaded files, delete, etc...
});

</script>

【问题讨论】：

嗨。你能提供一个jsFiddle吗？

标签： javascript html dropzone.js dropzone

【解决方案1】：

您将类 dropzone2 用于第二个 dropzone，因此 dropzone.js 无法将其识别为 dropzone。此外，调用第一个 dropzone 后更改 dropzone 选项似乎会阻止选项更改。

试试这个，希望对你有帮助

<div class="first">
    <div class="inner">
        <form class="dropzone" id="mydropzone" action="up.php"></form>
    </div>
</div>
<div class="second">
    <div class="inner">
        <form class="dropzone" id="mydropzone2" action="up2.php"></form>
    </div>
</div>
<script>
    Dropzone.autoDiscover = false;
    Dropzone.options.mydropzone = {
        dictDefaultMessage: "my custom text one!"
    };
    Dropzone.options.mydropzone2 = {
        dictDefaultMessage: "my custom text two!"
    };
    $("#mydropzone").dropzone({
        //dropzone stuff here like show already uploaded files, delete, etc...
    });
    $("#mydropzone2").dropzone({
        //dropzone stuff here like show already uploaded files, delete, etc...
    });
</script>

【讨论】：