Question

我正在尝试制作视频预览脚本。我想要拖放的一个函数和input type =“file”元素选择的文件。这是功能：

                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);

我真的看不出读者的错误。从未调用过！在一些帮助下会很棒！

Answer 1

当我遇到类似的问题时，到了这里。

尝试实施 onerror ，您会发现Google Chrome会出现“安全错误”。同样适用于Firefox（7.0.1）。

由于Google Chrome对开发人员施加了本地文件安全限制。这种本地文件安全限制确实会对快速开发测试产生影响！

将HTML放在Web服务器上，问题得以解决。没有网络服务器？尝试Firefox！ - 允许文件从文件访问 选项对我来说从未真正起作用！

最佳，斯里达尔

在HTML5中使用FileReader选择文件的问题

1 个答案: