我目前正在从事 Unity Webgl 项目,我是 javascript 和 web 的新手。
在我的项目中,用户必须能够将图片和视频添加到 webgl 播放器,图片工作正常(感谢 gman 在这 thread 上的代码)。我用它作为我的脚本的基础。当然,我已经更改了输入接受,以便能够获取视频(仅限 mp4)。但是我遇到了一些麻烦。
我读过这个tutorial以及我找到的关于 javascript 文件、Blob 等的所有文档。但我没有让它工作。我相信 FileReader
有一些我不明白的地方,因为永远不会调用 "load"
监听器上的 console.log
,同样“onerror”
监听器,除非我单击取消(来自代码 here)。
function getPic( evt ) {
var file = document.querySelector( 'input[type=file]' ).files[0];
var reader = new FileReader();
reader.addEventListener( "onload", function () {
reader.readAsDataURL( file );
console.log( reader.result );
}, false );
reader.addEventListener( "onerror", function ( error ) {
console.log( "error" + error );
}, false );
}
我也尝试过 onloadend
但它不起作用,因为 onload/onloadend
监听器从未调用我的脚本 print "null"
。这是一个好的开始还是有更简单的方法从用户计算机获取 video/image
?
最佳答案
FileReader.onload属性包含一个事件处理程序,当“加载”事件被触发时,当内容读取(例如 readAsDataURL)可用时执行
- 事件监听器应该监听'load'。事件而不是'onload'
reader.addEventListener("load", function(event) {...
reader.onload = function() {...
reader.readAsDataURL(file) 在回调函数中被调用
- 移动行 reader.readAsDataURL(file);在 'load' 事件回调函数之外
reader.addEventListener("load", function(){
console.log(reader.result);
}, false);
reader.readAsDataURL(file);
关于javascript - 文件读取器 API 'load' 事件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37528979/