在HTML中,input (type= file)上传图片时如何预览图片。
结构如下:
<input type="file" name="" id="updataimg" />
<img id="imgs" src="" />
javascript:
1.先获取input和img对象
var ipt = document.getElementById('updataimg');
var imgs = document.getElementById('imgs');
2.选中图片后,input执行onchange函数
ipt.onchange = function() {
var file = ipt.files[0];
var imageType = /^image\//;
if ( !imageType.test(file.type) ) {
alert('请选择图片');
}else {
var reader = new FileReader();
reader.onload = function(e) {
imgs.src = e.target.result;
};
reader.readAsDataURL(file);
}
}