javascript - Dropzone以编程方式在div内不起作用

Question

我在使用 dropzone 时遇到问题，我正在尝试将其包含在 div 中，但无法正常工作。起初我的 js 上没有 div.dropzone 的东西，也没有出现错误，但是上传部分没有运行，这是因为我从未指出 dropzone 类在 div 内，当我添加时，我开始收到错误。这是我的代码：

<div class="dropzone" id="myDropzone">
    <input style="display:none" name="file_c" id="file_c" type="file" multiple>

    <div id="preview">
    </div>
    <div id="dropzonePreviewTemplate" style="display: none">
      <div id="template-preview" class="dz-preview dz-nofile-preview">

        <div class="small">
          <span class="" data-dz-name></span> <span class="pull-right">(<span class="dz-size" data-dz-size></span>)</span>
        </div>
      </div>
    </div>
    </div>

然后我的js

Dropzone.autoDiscover = false;


    $("div#myDropZone").dropzone({ url: "https:url.php",



      autoProcessQueue: false,
      paramName: "file_c",
      uploadMultiple: true,
      dictDefaultMessage:"<?php echo _e('Click here or drag and drop to upload your files'); ?>",
      addRemoveLinks: true,
      acceptedFiles: "image/gif,image/png,image/bmp,image/tiff,image/x-icon,video/x-ms-asf,video/x-ms-wmv,video/x-ms-wmx,video/x-ms-wm,video/avi,video/divx,video/x-flv,video/quicktime,video/mpeg,video/mp4,video/ogg,video/webm,video/x-matroska,video/3gpp,video/3gpp2,text/plain,text/csv,text/tab-separated-values,text/calendar,text/richtext,text/css,text/html,text/vtt,application/ttaf+xml,audio/mpeg,audio/aac,audio/x-realaudio,audio/wav,audio/ogg,audio/flac,audio/midi,audio/x-ms-wma,audio/x-ms-wax,audio/x-matroska,application/rtf,application/javascript,application/pdf,application/x-shockwave-flash,application/java,application/x-tar,application/zip,application/x-gzip,application/rar,application/x-7z-compressed,application/x-msdownload,application/octet-stream,application/octet-stream,application/msword,application/vnd.ms-powerpoint,application/vnd.ms-write,application/vnd.ms-excel,application/vnd.ms-access,application/vnd.ms-project,application/vnd.openxmlformats-officedocument.wordprocessingml.document,application/vnd.ms-word.document.macroEnabled.12,application/vnd.openxmlformats-officedocument.wordprocessingml.template,application/vnd.ms-word.template.macroEnabled.12,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet,application/vnd.ms-excel.sheet.macroEnabled.12,application/vnd.ms-excel.sheet.binary.macroEnabled.12,application/vnd.openxmlformats-officedocument.spreadsheetml.template,application/vnd.ms-excel.template.macroEnabled.12,application/vnd.ms-excel.addin.macroEnabled.12,application/vnd.openxmlformats-officedocument.presentationml.presentation,application/vnd.ms-powerpoint.presentation.macroEnabled.12,application/vnd.openxmlformats-officedocument.presentationml.slideshow,application/vnd.ms-powerpoint.slideshow.macroEnabled.12,application/vnd.openxmlformats-officedocument.presentationml.template,application/vnd.ms-powerpoint.template.macroEnabled.12,application/vnd.ms-powerpoint.addin.macroEnabled.12,application/vnd.openxmlformats-officedocument.presentationml.slide,application/vnd.ms-powerpoint.slide.macroEnabled.12,application/onenote,application/oxps,application/vnd.ms-xpsdocument,application/vnd.oasis.opendocument.text,application/vnd.oasis.opendocument.presentation,application/vnd.oasis.opendocument.spreadsheet,application/vnd.oasis.opendocument.graphics,application/vnd.oasis.opendocument.chart,application/vnd.oasis.opendocument.database,application/vnd.oasis.opendocument.formula,application/wordperfect,application/vnd.apple.keynote,application/vnd.apple.numbers,application/vnd.apple.pages",
      maxFiles: 10,

      init: function(){
        var submitButton = document.querySelector("#sendForm")
        myDropzone = this;
        submitButton.addEventListener("click", function() {
            myDropzone.processQueue(); 
        });
        var self = this;
        self.options.dictRemoveFile = "<span style='margin-left:5px; color:red; position:right;' title='Remove'><i class='glyphicon glyphicon-trash'></i></span>";



        this.on("complete", function(){
            if(this.getQueuedFiles().length == 0 && this.getUploadingFiles().length == 0)
            {
             var _this = this;
             _this.removeAllFiles();
            }
        list_image();
        });

    }


    });

我收到两个错误：

1) Uncaught SyntaxError: Unexpected end of input
2) Uncaught Error: No URL provided.
    at new Dropzone (dropzone.js:1066)
    at dropzone.js:2968
    at Function.Dropzone.discover (dropzone.js:2974)
    at Dropzone._autoDiscoverFunction (dropzone.js:3516)
    at HTMLDocument.init (dropzone.js:3484)

有谁知道如何解决这一问题？

标签： javascripthtmldropzone.js