web-dev-qa-db-ja.com

ドロップゾーンが定義されていません

私はJavaScriptにまったく慣れていないので、これが私を夢中にさせています。

Dropzone.jsを使用したいので、ファイルdropzone.jsを here からダウンロードし、次のようにビューに含めました。

<script src="<?php echo JS_DIRECTORY; ?>/dropzone.js"></script>

次に、次のようなフォームを作成しました。

<form action="http://localhost/project/uploadTest/upload" class="dropzone">
</form>

そしてそれはうまくいきます。それはphp関数を指し、私はサーバーサイトでアップロードを処理します。

問題は、JSのdropzoneオブジェクトにアクセスして構成したい場合です。私がする時

// "myAwesomeDropzone" is the camelized version of the HTML element's ID
Dropzone.options.myAwesomeDropzone = {
  paramName: "file", // The name that will be used to transfer the file
  maxFilesize: 2, // MB
  accept: function(file, done) {
    if (file.name == "justinbieber.jpg") {
      done("Naha, you don't.");
    }
    else { done(); }
  }
};

私は得る

Uncaught ReferenceError：Dropzoneが定義されていません

どんな助けでもありがたいです、ありがとう

javascriptjquerydropzone.js
8
zachu

コードの実行が早すぎる可能性があります。それを包む：

window.onload = function() {
    // access Dropzone here
};

または、より良い（上記のコードよりも早く実行されます）：

document.addEventListener("DOMContentLoaded", function() {
    // access Dropzone here
});

または、jQueryを使用する場合：

$(function() {
    // access Dropzone here
});
13
trincot

これに従ってください：

HTMLファイル：

<form action="your url" class="dropzone" id="dropzone-form">
</form>

JSファイル：

window.onload = function() {
    // dropzoneFormis the configuration for the element that has an id attribute
    // with the value dropzone-form (or dropzoneForm)
    //initialize the dropzone;
    Dropzone.options.dropzoneForm = {
            autoProcessQueue: 'your value',
            acceptedFiles: 'your value',
            maxFilesize: 'your value',
            ....and so on.
            init: function() {
               myDropzone = this;

               this.on('addedfile', function(file) {
                   //todo...something...
               }
               //catch other events here...
            }
    };
};
0
Rana_Sundar