【问题标题】:DropZone Replace image in initDropZone 在初始化中替换图像
【发布时间】:2014-10-12 07:37:59
【问题描述】:

我使用此代码在 init 中从数据库上传图像。现在我想在上传新图片时删除这个初始图片。

 var o = $("div#uploader").dropzone({
            url: "../../Merchant/UploadLogo",
            paramName: "logo",
            maxFiles: 1,

            //enqueueForUpload: false,
            maxfilesexceeded: function (file) {
                this.removeAllFiles();
                this.addFile(file);
            },

            addRemoveLinks: true,
            uploadMultiple: false,
            dictRemoveFile: "حذف",

            removedfile: function(file) {
                RemoveFile("Logo");
                var _ref;
                return (_ref = file.previewElement) != null ? _ref.parentNode.removeChild(file.previewElement) : void 0;
            },

            init: function() {

                var mockFile = { name: "avatar1.jpg", size: 12345, type: 'image/jpeg', url: "../../Merchant/GetLogo" };
                this.options.addedfile.call(this, mockFile);
                this.options.thumbnail.call(this, mockFile, mockFile.url);//uploadsfolder is the folder where you have all those uploaded files
            }

        });

【问题讨论】:

    标签: javascript jquery dropzone.js


    【解决方案1】:

    我假设您希望在成功上传新图像时替换 Dropzone 中的旧图像。你可以通过结合Dropzone提供的this.on('success')this.removeFile方法来做到这一点:

    Dropzone.options.myDropzone = {
        init: function() {
            this.on('success', function(file, message) {
                if (this.files.length > 1) {
                    this.removeFile(this.files[0]);
                }
            });
    
            // ...
        }
    };
    

    为此,您的mockFile 还必须注册为您的 Dropzone 的文件之一。为此,您可以在显示后将其推送到 init 中的 this.files 数组中:

    // Create and Display Mock File
    var mockFile = { name: "avatar1.jpg", size: 12345, url: '/image.png' };
    this.options.addedfile.call(this, mockFile);
    this.options.thumbnail.call(this, mockFile, mockFile.url);
    
    // Register it
    this.files = [mockFile];
    

    来源: Dropzone#SuccessEvent, Dropzone#Methods 和经验

    【讨论】:

    • 太棒了,这确实可以,通过maxFiles 限制上传到一个文件应该做什么(但不正确)。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2020-08-29
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多