如何重新初始化 dropzone 元素答案

【问题标题】：How to reinitialize a dropzone element如何重新初始化 dropzone 元素
【发布时间】：2019-09-18 05:07:49
【问题描述】：

我想使用 dropzone 来显示服务器上已有图像的缩略图。我正在为一个房地产网站创建一个 CMS。服务器具有与属性站点相关联的图像。当页面加载时，我的 dropzone 的 init 函数将给定站点的相关图像显示为 dropzone 中的缩略图。

页面上有一个下拉框，可让用户选择另一个站点。当他们这样做时，我希望 Dropbox 对象基本上再次执行 init 函数中的操作。调用服务器并显示与此不同站点关联的缩略图。

我还没有找到解决方案（显然）。通常，我会在我尝试过的东西中得到类似“dropzone 仍然连接”之类的东西。我似乎在文档中看不到任何有用的东西。

任何帮助将不胜感激:)

//我的拖放区对象

var myDropzone = $('#featured-development-dropzone').dropzone({
                    url: '@Url.Action("SaveFeaturedDevelopmentImage","Homepage")',
                    maxFiles: 1,
                    addRemoveLinks: true,
                    init: function () {
                        var myDropzone = this;
                        $("select").on('click', function () {
                            myDropzone.removeAllFiles(true);
                        });
                        var siteID = $('#siteDropdown').find(':selected').val();
                        $.ajax({
                            url: '@Url.Action("GetFeaturedDevelopmentImage", "Homepage")',
                            data: { siteID: siteID },
                            type: 'GET',
                            success: function (data) {
                                console.log(data);
                                if (data.data != null) {
                                    var mockFile = {
                                        name: data.filename,
                                        size: data.fileSize
                                    };

                                    // Call the default addedfile event handler
                                    myDropzone.emit("addedfile", mockFile);
                                    console.log(typeof (data));

                                    // And optionally show the thumbnail of the file:

                                    myDropzone.emit("thumbnail", mockFile, "data:image/png;base64," + _arrayBufferToBase64(data.data));
                                    myDropzone.emit("complete", mockFile);
                                }
                            }
                        });
                        this.on("sending", function (file, xhr, formData) {
                            formData.append("SiteID", siteID);
                            formData.append("imageTypeID", 4);
                            console.log(formData);
                        });
                    }
                });


            var prevSiteID;
            $("select").on('click', function () {
                prevSiteID = this.value;
            }).change(function () {
                var newSIteID = this.value;
               // potentially put code here that will reinitialize the dropbox and display images associated with different site.                

                console.log(prevSiteID);
                console.log(newSIteID);
                changeFeaturedDevelopment(prevSiteID, newSIteID);

【问题讨论】：

标签： javascript c# asp.net dropzone.js dropzone

【解决方案1】：

我相信您需要再次调用该函数。因为当您尝试附加新图像时，dropzone 区域已在页面加载中定义。或者您再次调用 init 或尝试重置它，以便 dropzone 可以重新附加另一个图像。

【讨论】：