Javascript 在HTML5中使用FileReader选择文件时出现问题
我正在尝试制作一个视频预览脚本。我想要一个用于拖放和由输入type=“file”元素选择的文件的函数。以下是函数:Javascript 在HTML5中使用FileReader选择文件时出现问题,javascript,html,filereader,Javascript,Html,Filereader,我正在尝试制作一个视频预览脚本。我想要一个用于拖放和由输入type=“file”元素选择的文件的函数。以下是函数: function FileHandler(files){ for(var i = 0; i < files.length; i++){ file = files[i]; var reader = new F
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);
}
}
我真的看不出读者出了什么问题。永远不会调用onload!如果有人帮忙,那就太好了 当我面临类似问题时来到这里 尝试实现onerror,你会发现谷歌浏览器抛出了一个“安全错误”。不过在Firefox(7.0.1)中也是如此 这是因为谷歌Chrome对开发者施加了本地文件安全限制。这种本地文件安全限制确实会影响快速开发测试 将HTML放到web服务器上,问题就解决了。没有网络服务器?试试Firefox! --允许从文件访问文件选项对我来说从来都不起作用 最好的, 斯利德哈
<input type="file" id="OpenFileDialog" multiple onchange="FileHandler(this.files)">
function d(e){
e.stopPropagation();
e.preventDefault();
files = e.dataTransfer.files;
FileHandler(files);
}
document.getElementById('droparea').addEventListener('drop',d,false);