如何限制上传的dropzone.js文件的数量？
根据使用情况，如何限制dropzone.js允许的文件数量？
例如，我可能只需要允许上传1，2或4个文件。
这不是uploadMultiple 。 不幸的是， uploadMultiple仅适用于每个请求处理的文件数量。
我做了一个稍微不同的方式。 任何时候添加一个新文件，我只是删除旧的丢弃的文件。 它用作覆盖这个用户体验的文件，这是我在这里所要做的。
Dropzone.options.myAwesomeDropzone = { accept: function(file, done) { console.log("uploaded"); done(); }, init: function() { this.on("addedfile", function() { if (this.files[1]!=null){ this.removeFile(this.files[0]); } }); } };
Nowell指出，这已经在 2013年8月6日解决了。使用这种forms的一个工作示例可能是：
<form class="dropzone" id="my-awesome-dropzone"></form>
你可以使用这个JavaScript：
Dropzone.options.myAwesomeDropzone = { maxFiles: 1, accept: function(file, done) { console.log("uploaded"); done(); }, init: function() { this.on("maxfilesexceeded", function(file){ alert("No more files please!"); }); } };
dropzone元素甚至获得了特殊的风格，所以你可以做这样的事情：
<style> .dz-max-files-reached {background-color: red}; </style>
我认为最直观的单个file upload过程是在新的条目上replace以前的文件。
$(".drop-image").dropzone({ url: '/cart?upload-engraving=true', maxFiles: 1, maxfilesexceeded: function(file) { this.removeAllFiles(); this.addFile(file); } })
maxFiles: 1做的工作，但如果你也想删除额外的文件，你可以使用从维基页面采取这个示例代码：
我怎样才能限制文件的数量？
你好运！ 从3.7.0开始，Dropzone支持maxFiles选项。 简单地将其设置为所需的数量，你很好去。 如果您不想要查看被拒绝的文件，只需注册maxfilesexceeded事件，并立即删除该文件：
myDropzone.on("maxfilesexceeded", function(file) { this.removeFile(file); });
它看起来像maxFiles是您正在寻找的参数。
https://github.com/enyo/dropzone/blob/master/src/dropzone.coffee#L667
您可以通过更改dropezone.js来限制上传的文件数量
Dropzone.prototype.defaultOptions = {maxFiles：10，}
提供的解决scheme的问题是，您只能上传1个文件。 在我的情况下，我需要一次只上传一个文件（点击或放下）。
这是我的解决scheme..
Dropzone.options.myDropzone = { maxFiles: 2, init: function() { this.handleFiles = function(files) { var file, _i, _len, _results; _results = []; for (_i = 0, _len = files.length; _i < _len; _i++) { file = files[_i]; _results.push(this.addFile(file)); // Make sure we don't handle more files than requested if (this.options.maxFiles != null && this.options.maxFiles > 0 && _i >= (this.options.maxFiles - 1)) { break; } } return _results; }; this._addFilesFromItems = function(items) { var entry, item, _i, _len, _results; _results = []; for (_i = 0, _len = items.length; _i < _len; _i++) { item = items[_i]; if ((item.webkitGetAsEntry != null) && (entry = item.webkitGetAsEntry())) { if (entry.isFile) { _results.push(this.addFile(item.getAsFile())); } else if (entry.isDirectory) { _results.push(this._addFilesFromDirectory(entry, entry.name)); } else { _results.push(void 0); } } else if (item.getAsFile != null) { if ((item.kind == null) || item.kind === "file") { _results.push(this.addFile(item.getAsFile())); } else { _results.push(void 0); } } else { _results.push(void 0); } // Make sure we don't handle more files than requested if (this.options.maxFiles != null && this.options.maxFiles > 0 && _i >= (this.options.maxFiles - 1)) { break; } } return _results; }; } };
希望这可以帮助 ;）
我想指出。 也许这只是发生在我身上，但是当我在dropzone中使用this.removeAllFiles（）时，它触发了事件COMPLETE，这个事情发生了，我做的是检查fileData是否为空，所以我实际上可以提交表单。
为什么不使用CSS来禁用点击事件？ 当达到最大文件时，Dropzone会自动添加一个dz-max-files-reached的类。
使用CSS禁用点击dropzone：
.dz-max-files-reached { pointer-events: none; cursor: default; }
信贷：这个答案
你也可以添加callback – 在这里我使用Dropzone的Angular
dzCallbacks = { 'addedfile' : function(file){ $scope.btSend = false; $scope.form.logoFile = file; }, 'success' : function(file, xhr){ $scope.btSend = true; console.log(file, xhr); }, 'maxfilesexceeded': function(file) { $timeout(function() { file._removeLink.click(); }, 2000); } }
