首页 > 解决方案 > dropzone.js 选项可能未放置在正确的位置

问题描述

我正在使用Dropzone.js,但我的选项根本无法识别。我试图将代码放在不同的地方,但我不确定它应该放在哪里。我读到 Dropzone.options 必须不在 document.ready 中,否则它将不起作用。

<form action="/" method="post" class="dropzone" id="my-dropzone"></form>

<script>

var myDropzone = new Dropzone("#my-dropzone");
// Disabling autoDiscover, otherwise Dropzone will try to attach twice.
Dropzone.autoDiscover = false;
Dropzone.options.myDropzone = {
    paramName: 'photo',
    acceptedFiles: '.jpg, .jpeg, .png',
    maxFilesize: 1,
    init: function() {
        this.on("uploadprogress", function(file, progress) {
            console.log("File progress", progress);
        });
    }
}

标签: javascriptdropzone.jsdropzone

解决方案


也许你可以试试这个,希望对你有帮助。

单击此处查看JSFiddle 演示

其他替代代码,请单击此处

$(function() {

  Dropzone.options.myDropzone = {
    maxFilesize: 1,
    addRemoveLinks: true,
    dictResponseError: 'Server not Configured',
    acceptedFiles: ".png,.jpg,.jpeg",
    init: function() {
      var self = this;
      // config
      self.options.addRemoveLinks = true;
      self.options.dictRemoveFile = "Delete";
      //New file added
      self.on("addedfile", function(file) {
        console.log('new file added ', file);
      });
      // Send file starts
      self.on("sending", function(file) {
        console.log('upload started', file);
        $('.meter').show();
      });

      // File upload Progress
      self.on("totaluploadprogress", function(progress) {
        console.log("progress ", progress);
        $('.roller').width(progress + '%');
      });

      self.on("queuecomplete", function(progress) {
        $('.meter').delay(999).slideUp(999);
      });

      // On removing file
      self.on("removedfile", function(file) {
        console.log(file);
      });
    }
  };
})

推荐阅读