Question

我正在使用Dropzone.js上传图片。到目前为止，这是有效的。

现在我想为用户提供将除图像之外的其他文件拖到同一个dropzone的可能性 - 但不应上传它们。相反，我只想在客户端以编程方式处理它们。

我怎样才能做到这一点？

我知道有accept函数可以用来检查我是否要上传文件 - 但这没有帮助：如果我拒绝文件，它会将文件标记为错误。我不想要这个。

基本上，我需要一种在实际启动之前拦截上传的方法，并且能够以编程方式取消它。这可能吗？

Answer 1

我认为要实现此目的，您必须禁用autoprocessQueue，以便您可以随时上传文件。

然后我们可以手动编码我们想要处理文件的位置。示例代码可能如下所示，您可以根据需要进行调整。

     Dropzone.options.myAwesomeDropzone = {
      maxFiles: 1,
      addRemoveLinks: true,
      autoProcessQueue: false, //heres where you tell it not to upload by itself and wait for you to tell it to upload
      autoDiscover: false,
        accept: function(file, done) {
          console.log("uploaded");
          done();
        },

      init: function() {

        var myDropzone = this; 

        //gets called when max files is reached . In our case its 1 file
        //so it will get called whenever a single file is dragged inside
        this.on("maxfilesreached", function(file){

        //here we check if the image is an image file or not 
        //if : it is not we simple tell the user and remove it 
        //else : just process the uploaded file
           if(file.type != "image/jpeg" && file.type != "image/png") {
               alert("Only Image file allowed for uploading");
                this.removeFile(file); //remove the file
             }else{
                 myDropzone.processQueue(); //upload the image file
              }

        });

        //this will get called when max files exceeds . in our case its 1 file
        //so it will get called whenever someone tries to upload more than 1 file
        this.on("maxfilesexceeded", function(file){

           //you can check fir filetypes that you want to allow like we did it above  
           //Do whatever client side extra stuff you want to do with the file

        });


      } //end of init

   };

试一试，看看它是否适合你。

如何取消上传而不显示错误？

1 个答案: