Question

我正在尝试基本上获得一个预览图像，我一直在做一些研究并跟随其他一些人的代码但由于某种原因，我的图像不会出现，任何人都可以告诉我为什么它不会显示？

HTML代码

<input type="file" accept="image/*;capture=camera" id="myfile" name="myfile">
<output name="image" id="list"> </output>

的JavaScript

<script>
function handleFileSelect(evt) {
    var files = evt.target.files; // FileList object, files[0] is your file
    var f = files[0];
    var reader = new FileReader();

    reader.onload = (function(theFile) {
       return function(e) {
           document.getElementById('list').innerHTML = ['<img src="', e.target.result,'" title="', theFile.name, '" width="50" />'].join('');
       };
    })(f);

    reader.readAsDataURL(f);
    }

    document.getElementById('myfile').addEventListener('change', handleFileSelect, false);
    </script>

如果有人能告诉我我做错了什么，我将不胜感激！感谢

Answer 1

您的代码和外观工作正常。看一看： http://jsbin.com/atekeh

您是否使用没有文件API的浏览器？

Answer 2

显然，你放置javascript的地方很重要。我必须做的就是让它工作是将javascript移动到输出下方，它现在完美运行了！

HTML文件图像不会显示

2 个答案: