在将图像上传到服务器之前，在画布中显示它们。
提问于 2013-11-10 22:49:10
在上传到服务器之前，我试图在画布中显示图像。我对html 5没有太多的经验。谁能给我看这方面的解决方案？？
<form action="#" method="POST" ecrtype="myltipart/form-data">
<button type="buttom" class="file-uploader">
<input class="img-fields" type="file" name="files[]" multiple >
<span>add files ...</span>
</button>
<input type="submit" name="upload" value="upload">
</form>
<canvas></canvas>
回答 1
Stack Overflow用户
回答已采纳
发布于 2013-11-10 23:46:22
使用下面的方法，您可以在上传图像之前预览 (100%客户端)。
给你：
html：
<input type="file" id="fileInput" />
<div id="preview"></div>javascript：
document.getElementById('fileInput').addEventListener('change', function(){
var file = this.files[0];
window.URL = window.URL || window.webkitURL;
var blobURL = window.URL.createObjectURL(file);
document.getElementById('preview').innerHTML = '<img src="' + blobURL + '" />';
});希望这能帮上忙。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/19900437
复制相关文章
腾讯云开发者
