Javascript Dropzone.js-单击Dropzone元素时不会发生任何事情

我尝试在页面中添加组件，但我对这个组件感到非常痛苦：无论我做什么，当我在dropzone的元素中单击或删除文件时，都不会发生任何事情

<form id="registerUserForm" onsubmit="return submitForm()" class="mt-5">

    <div id="dropzoneDiv" class="dropzone dz-clickable">
        <div class="dz-default dz-message">
            <span>Drop files here to upload</span>
        </div>
     </div>
        .
        .
        .
</form>

组件已正确渲染，但“简单”不起作用：

---

我是否做错了我没有注意到的事情？

我偶然发现了解决方案，问题在于$（document）.ready（）语句。如果删除此侦听器并直接使用dropzone配置调用，则该组件可以正常工作：

var dropzone = null;

Dropzone.autoDiscover = false;
dropzone = $("#dropzoneDiv").dropzone({
    url: "/api/works/upload",
    acceptedFiles: 'image/*,video/*',
    autoProcessQueue: false,
    createImageThumbnails: true,
    addRemoveLinks: true
});

function submitForm() {
    dropzone.processQueue();
    return false;
}

---

尝试使用JQuery2.*， 如果您正在使用JQuery>3

var-dropzone=null；
$（文档）.ready（函数（）{
Dropzone.autoDiscover=false；
dropzone=$（“#dropzoneDiv”）。dropzone({
url:“/api/works/upload”，
acceptedFiles:'image/*，video/*'，
自动处理队列：false，
createImageThumbnails:true，
addRemoveLinks：正确
});
});
函数submitForm（）{
dropzone.processQueue（）；
返回false；
}

把文件放在这里上传

var dropzone = null;

Dropzone.autoDiscover = false;
dropzone = $("#dropzoneDiv").dropzone({
    url: "/api/works/upload",
    acceptedFiles: 'image/*,video/*',
    autoProcessQueue: false,
    createImageThumbnails: true,
    addRemoveLinks: true
});

function submitForm() {
    dropzone.processQueue();
    return false;
}