5

我目前正在开发一个 Unity Webgl 项目，并且我是 javascript 和 web 的新手。

在我的项目中，用户必须能够将图片和视频添加到 webgl 播放器，图片工作正常（感谢 gman 在此线程上的代码）。我用它作为我的脚本的基础。当然，我已经更改了输入接受以便能够获取视频（仅限 mp4）。但我遇到了一些麻烦。

我已经阅读了本教程以及我找到的关于 javascript 文件、Blob 等的所有文档。但我没有让它工作。我相信有一些我不理解的东西，FileReader因为永远不会调用监听器，监听器也是如此，console.log除非我点击取消（来自代码here）。"load""onerror"

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从用户计算机获取？

4

1 回答 1

4

FileReader.onload属性包含在触发“加载”事件时执行的事件处理程序，当内容读取（例如 readAsDataURL）可用时

  • 事件监听器应该监听'load'事件而不是 'onload'
reader.addEventListener("load", function(event) {...
reader.onload = function() {...

reader.readAsDataURL(file) 在回调函数中被调用

  • 移动行 reader.readAsDataURL(file); 在“加载”事件回调函数之外
reader.addEventListener("load", function(){
   console.log(reader.result);
}, false);

reader.readAsDataURL(file);

https://jsfiddle.net/3vk4u0fr/

于 2016-05-30T15:19:13.320 回答