javascript - 上传图片显示在页面是如何实现的?
本文介绍了javascript - 上传图片显示在页面是如何实现的?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
问 题
就像图片那样,上传图片后小图先显示在页面,这是通过ajax实现的吗,我现在还没学后端语言,自己一个人做,有什么办法实现吗?还是说这是后台负责的?
解决方案
不用ajax返回小图的url,直接用js就可以实现,下面是实现代码:
先看效果
HTML
<input type="file" id="imgInp">
<image id="blah" style="width:100px; height:100px;"/>
JS
function readURL(input) {
if (input.files && input.files[0]) {
var reader = new FileReader();
reader.onload = function (e) {
$('#blah').attr('src', e.target.result);
}
reader.readAsDataURL(input.files[0]);
}
}
$("#imgInp").change(function(){
readURL(this);
});
这篇关于javascript - 上传图片显示在页面是如何实现的?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文