28

我正在使用 dropzone.js 插件向我的应用程序添加图像上传器。我知道这可能是一个非常基本的问题,所以很抱歉,但我想做的是限制文件扩展名。这适用于单个文件扩展名,

<script type="text/javascript">
   Dropzone.options.dropzone = {
        accept: function(file, done) {
            console.log(file);
            if (file.type != "image/jpeg") {
                done("Error! Files of this type are not accepted");
            }
            else { done(); }
        }
    }
 </script>

所以我的问题是如何添加多个文件扩展名,即image/jpegimage/png

谢谢

4

6 回答 6

124

我是 Dropzone 的作者。

你应该使用. 这与元素的属性完全相同。这样,即使后备也能正常工作。acceptedMimeTypes acceptedFilesinputaccept

有效acceptedFiles属性可能如下所示:

  • audio/*
  • image/*
  • image/jpeg,image/png
  • ETC...

编辑:在 Dropzone 的最新版本中,此属性被调用acceptedFiles,它还允许您定义扩展。所以这会起作用:

"audio/*,image/*,.psd,.pdf"

(为了向后兼容acceptedMimeTypes在下一个主要版本之前仍然有效)

于 2013-06-24T12:47:34.133 回答
34

谢谢 enyo 它工作了....真棒...只需将该行粘贴到 dropjone.js->

uploadMultiple: true,  //upload multiple files
maxFilesize: 1,  //1 mb is here the max file upload size constraint
acceptedFiles: ".jpeg,.jpg,.png,.gif",

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

accept 的默认实现会根据该列表检查文件的 mime 类型或扩展名。这是一个逗号分隔的 mime 类型或文件扩展名列表。例如:'image/*,application/pdf,.psd' 如果 Dropzone 是可点击的,此选项也将用作隐藏文件输入的接受参数。

于 2013-10-15T07:33:47.877 回答
20

您可以向您的 . 中添加更多扩展if,如下所示:

if (file.type != "image/jpeg" && file.type != "image/png") {

这将检查文件类型是否与您指定的所有类型不同。要通过检查的文件,它必须不同于 image/jpeg AND image/png

更新

我建议看看enyo 的答案,因为他是 Dropzone 的作者。

于 2013-06-09T17:09:31.043 回答
9
var myDropzone = new Dropzone('div#profile_pictures',{
    acceptedFiles: "image/*", /*is this correct?*/
    init: function(){
        this.on("success", function(file, data) {
            /*..*/
            });
        } 
})
于 2013-10-10T01:43:05.730 回答
1
var dz = $("#FileUpload").dropzone({acceptedFiles: ".jpeg"})[0];
于 2018-10-24T06:12:43.887 回答
0

如果有人感兴趣(我无法评论 Enyo 的帖子):我在应用 Dropzone 选项时遇到了问题,经过调查,我注意到我使用的 jQuery jquery-3.2.1.min.js版本是其故障的原因

于 2018-11-05T11:26:37.593 回答