是否可以在不使用文件路径 src 的情况下插入图像?

Question

>假设我有一个图像以var someImage = document.getElementById("input1").files[0]的形式存储为表单中的变量。如何在不使用文件路径的情况下将此保存到变量的图像插入到 HTML 文档中？

Answer 1

是的，请参阅 FileReader.readAsDataURL((： 将文件读取为数据 URI。

document.getElementById("input1").onchange = function(e) {
var someImage = e.target.files[0]
var reader = new FileReader();
var img = document.getElementById('preview');
reader.onload=function(){
img.src = reader.result
}
reader.readAsDataURL(someImage)
}

<input type="file" id="input1" accept="image/*" />
<img id="preview" src="" />