ユーザーがファイル転送を開始するには、ウィジェットにドラッグ アンド ドロップする方法と、複数ファイル入力ボタンを使用する方法の 2 つが考えられます。複数のファイル入力を使用して、ファイル名の文字列をインテリジェントな「8つのファイルが選択されました」などに置き換える方法が気に入っています。
これを取得するには、入力を設定する必要があります。実際にドロップ イベントから xhr2 オブジェクトを作成する代わりに、その fileList を入力要素に渡し、入力の「変更」イベントを介して xhr2 をトリガーしたいだけです。
以下にいくつかのスケルトン コードを示します (イベント バインディングには jQuery を使用しますが、addListener も同じように機能するはずです)。
domNode.defaultUI.on("drop", "#progOver", function(evt) {
evt.preventDefault();
evt.stopPropagation();
function sendFiles() {
var fileList = evt.originalEvent.dataTransfer.files;
document.getElementById('files-upload').files = fileList;
}
if (someCondition) {
sendFiles();
}
});
domNode.defaultUI.on("change", '#files-upload', function(evt) {
console.log(evt.target.files); // fileList object in Chrome, empty (prototype) fileLIst in Firefox
});
fileList オブジェクト自体が読み取り専用であることは理解しており、Chrome は「はい、その fileList は改ざんされていません。許可しましょう」と言うように設計されており、Firefox は「バスは何ですか。私の素敵な安全なファイル入力を何かのオブジェクトで更新しようとしていますか? その臭いオブジェクトがどこから来たのかわかりません, 拒否!」
したがって、質問は次の 2 つです。
上記の仮定は正しいですか？これが、入力の「ファイル」プロパティを fileList と等しくできない理由ですか?
入力の files プロパティを更新する別の方法 (プロパティに値を追加しようとする代わりに) はありますか? 複数ファイルの入力ノードを並行して更新できるのはいいですね。