web-dev-qa-db-ja.com

jQueryを使用してDropzoneインスタンス/オブジェクトを取得する

私はjQueryを使用してdropzoneを操作しています。例えば.

$("#mydropzone").dropzone({ /*options*/ });

このメソッドを呼び出すことができるように、Dropzoneインスタンスを取得する必要があります。

myDropzone.processQueue()

どうすればこれを達成できますか?出来ますか?

言い換えれば、どのようにしてドロップゾーンを初期化できますか

$("#mydropzone").dropzone({ url: "/file/post" });

しかし同時に、私がそれを使用してそれを初期化するかのようにオブジェクトのインスタンスを取得します:

var myDropzone = new Dropzone("#mydropzone", { url: "/file/post"});

だから私は電話するかもしれません:

myDropzone.processQueue()

どうもありがとうございました。

21
preston

スクリプトは、指定されたdropzoneelementオブジェクトを追加するようです。だからあなたはこのようなことをすることができます:

var $dropZone = $("#mydropzone").dropzone({ /*options*/ });
// ...
$dropZone[0].dropzone.processQueue();
10
Jordan

issue#18 で説明されているように

組み込みのDropzone.forElement 関数。

var myDropzone = Dropzone.forElement("#mydropzone");
58
cweston

既に初期化されている場合、jQueryを使用してインスタンスにアクセスする簡単な方法:

var dropzone = $(this).get(0).dropzone;
4

要素のIDを指定したDropzone.instancesチェックを使用すると簡単に見えます。

function fn_check_has_dropzone_instances(id){
    var found = false;
    Dropzone.instances.forEach(function(item,index){
        if($($(item)[0].element).attr('id').trim()==id.trim()){
            console.log(id);
            found = true;
        }
    });
    return found;
}
1
Vuong Passion

前述のように、dropzoneのforElementを使用できます。これはelement.dropzoneをチェックするだけです。ここで、「要素」はネイティブの要素です(jquery objではありません)。したがって、前の回答をマージ、要約、説明、および展開するには、次のようにします。

var element = $("#mydropzone")[0]; // this is the way jquery gives you the original dom

以上、単なるjsで:

var element = document.querySelector("#mydropzone");

次に、次のようにドロップゾーンを取得します。

element.dropzone

または、より簡潔に(ここでは単純なjs):

var dzone = document.querySelector("#mydropzone").dropzone

参考までに、現在のドロップゾーンのforElementソース:

Dropzone.forElement = function (element) {
  if (typeof element === "string") {
    element = document.querySelector(element);
  }
  if ((element != null ? element.dropzone : undefined) == null) {
    throw new Error("No Dropzone found for given element. This is probably because you're trying to access it before Dropzone had the time to initialize. Use the `init` option to setup any additional observers on your Dropzone.");
  }
  return element.dropzone;
};
1
Luca Reghellin