实现原生button上传文件

于丸

于 2019-10-14 11:36:08 发布

阅读量759

点赞数 1

分类专栏：原生

本文链接：https://blog.youkuaiyun.com/Ych_cxy/article/details/102544811

版权

原生专栏收录该内容

12 篇文章

订阅专栏

<img id="head_img" src="./11.jpg" style="width: 100%;height: 100%;" alt="">

<input type="file" name="xx" id="upload_head_img" style="display:none" />
<input type="button" value="修改头像" id="btn" class="btn" style="width: 140px;height: 40px;" onclick="document.getElementById('upload_head_img').click();" />


document.getElementById("upload_head_img").addEventListener("change",(e)=>{
					// console.log(e.target.files[0])
					var reader = new FileReader(); 
					 reader.readAsDataURL(e.target.files[0]);  
						reader.onload = function(){  
						// console.log(reader.result); 
						 document.getElementById("head_img").src = reader.result
					}  
				})