2

dataTransfer.getData(http://html5demos.com/drag-anything)を使用してHTML5のドラッグアンドドロップを設定しようとしています。これにより、任意のテキストがドロップウィンドウに読み込まれ、plupload(http://www.plupload.com)を使用して保存されます。そのデータ。

現在のコード:

if (getDataType.checked == false && e.dataTransfer.types) {
    li.innerHTML = '<ul>';
    [].forEach.call(e.dataTransfer.types, function (type) {
      li.innerHTML += '<li>' + entities(e.dataTransfer.getData(type) + ' (content-type: ' + type + ')') + '</li>';
      if (e.dataTransfer.types == 'Files') {
          li.innerHTML += '<li>' + entities(e.dataTransfer.getData(type) + ' (uploadable: ' + type + ')') + '</li>';
      }
    });
    li.innerHTML += '</ul>';

  } else {
    // ... however, if we're IE, we don't have the .types property, so we'll just get the Text value
    li.innerHTML = e.dataTransfer.getData('Text');
  }

dataTransfer.getDataの出力をpluploadに取り込み、ファイルとテキストのスニペットの違いを知っているドロップゾーンを取得するためのサポートが必要です。

編集: 私が試したことの周りにさらにコンテキストを追加します。1.ドロップされたアイテムがファイルである場合、ifステートメントを使用して何かを実行します。(私は)アイテムがすでにドロップされているためアップロードできないため、これは機能しません。2. dataTransfer.filesを取得しますが、アップロード可能なファイルは保存されず、スニペットのオンザフライ書き込みが強制終了されます。

解決策には、最初にドロップされたアイテムをクエリしてから、ファイルにpluploadを使用し、スニペットにdataTransfer.getDataを使用することが含まれると思います。問題は、これを行う方法がわからないことです。どんな助けでも大歓迎です。

4

1 に答える 1

0

別のイベントをpluploadドロップエリアにバインドできます。そのイベントで、スニペットかどうかを確認します。スニペットがある場合は、スニペットで必要な操作を行います。それ以外の場合は、pluploadにファイルのドラッグアンドドロップを処理させます。

www.plupload.comにはたくさんの例があり、それらには本当に良いフォーラムもいくつかあります。

また、ここhttp://www.foliotek.com/devblog/plupload-custom-file-upload-ui/にブログ投稿を書きました。これは、Pluploadを使用してドラッグアンドドロップ領域を利用するカスタムUIをバインドする方法を示しています。ファイルのアップロード。

お役に立てば幸いです...

于 2011-08-23T14:46:16.317 に答える