超过文件大小时抛出的事件

Question

当您设置了最大文件大小并将超过该限制的文件拖放到其中时，DropZone 是否会引发事件？我尝试了以下事件，但它们似乎没有被触发。

错误，重置，添加文件，删除文件，删除。

目前，当您将太大的文件拖放到区域中时，我们的实现不会执行任何操作。我们想提供反馈文件超过我们的文件大小的最大限制。

Answer 1

它不会抛出任何事件，它会return给你一条错误信息。

来自 dropzone.js

的代码片段

Dropzone.prototype.accept = function(file, done) {
  if (file.size > this.options.maxFilesize * 1024 * 1024) {
    return done(this.options.dictFileTooBig.replace("{{filesize}}", Math.round(file.size / 1024 / 10.24) / 100).replace("{{maxFilesize}}", this.options.maxFilesize));
  }
  .
  .
  .
}

http://www.dropzonejs.com/#config-dictFileTooBig

要抛出错误消息，请将 maxFilesize: 2, // MB 添加到配置

http://www.dropzonejs.com/#configuration

previewTemplate 必须包含具有 "dz-error-message" class

的 div 元素

previewTemplate: '<div class="dz-preview dz-file-preview">
  <div class="dz-details">
    <div class="dz-filename"><span data-dz-name></span></div>
  <div class="dz-size" data-dz-size></div>
  <img data-dz-thumbnail />
 </div>
 <div class="dz-progress"><span class="dz-upload" data-dz-uploadprogress></span></div>
 <div class="dz-success-mark"><span>✔</span></div>
 <div class="dz-error-mark"><span>✘</span></div>
 <div class="dz-error-message"><span data-dz-errormessage></span>     </div>
 </div>'

http://www.dropzonejs.com/#layout

Answer 2

var dropZoneDiv = new Dropzone("div#DropZoneDiv", {
        url: "UPLOAD",
        previewTemplate: document.querySelector('#preview-template').innerHTML,
        thumbnailHeight: 100,
        thumbnailWidth: 100,
        addedfile: function (file) {
            if (file.size > (1024 * 1024 * 50)) // not more than 5mb
            {
                this.removeFile(file);
                abp.message.error("Only 50 mb file size is allowed");
            }
        },

超过文件大小时抛出的事件

Event Thrown when Filesize is Exceeded

dropzone.js