1

ビデオ プレビュー スクリプトを作成しようとしています。ドラッグ アンド ドロップと、input type="file" 要素で選択されたファイルの両方に 1 つの関数が必要です。関数は次のとおりです。

                function FileHandler(files){
                    for(var i = 0; i < files.length; i++){

                        file = files[i];

                        var reader = new FileReader();
                        reader.onload = function(evt){
                            var VideoSpan = document.createElement('span');
                            var Video = document.createElement('video');
                            VideoSpan.classList.add('VideoPreviewSpaner');
                            Video.classList.add('VideoPreview');
                            Video.controls="controls";
                            Video.src = evt.target.result
                            VideoSpan.appendChild(Video);
                            document.getElementById('VideoWindow').appendChild(VideoSpan);
                            document.getElementById('VideoWindow').style.display = "block";
                        }
                        reader.readAsDataURL(file);
                    }
                }

そして、

<input type="file" id="OpenFileDialog" multiple onchange="FileHandler(this.files)">

そして dnd ハンドラー:

            function d(e){
                e.stopPropagation();
                e.preventDefault();
                files = e.dataTransfer.files;
                FileHandler(files);
            }
            document.getElementById('droparea').addEventListener('drop',d,false);

reader.onload が呼び出されないのは本当に何が悪いのかわかりません! いくつかの助けがあれば素晴らしいでしょう！

4

1 に答える 1

2

同様の問題に直面したときにここに来ました。

onerrorを実装しようとすると、Google Chrome が「セキュリティ エラー」をスローすることがわかります。ただし、Firefox(7.0.1) でも同じように動作します。

これは、Google Chrome が開発者に課したローカル ファイル セキュリティ制限によるものです。このローカル ファイルのセキュリティ制限は、迅速な開発テストに大きな打撃を与えます。

HTML を Web サーバーに置くと、問題は解決します。ウェブサーバーがありませんか？Firefoxで試してみてください！ --allow-file-access-from-filesオプションが実際に機能したことはありません。

ベスト、シュリダール

于 2011-10-30T07:13:57.893 に答える