JavaScript图片预览
2021-04-29 03:29
阅读：743
标签：element 预览 数据 url onload code ada targe new
预览选中的图片文件
- jQuery
$("#selectImage").change(function(){ $("#image").attr("src",URL.createObjectURL($(this)[0].files[0])); }); - Vue
data:{ image:"" }, methods:{ imageReaderAndShow:function (e) { //e是input type="file" 的change事件 let fileReader = new FileReader(); fileReader.readAsDataURL(e.target.files[0]); //e.target.files[0]是选中的图片文件数据 fileReader.onload=function(){ e.target.nextElementSibling.src=fileReader.result; //e.target.nextElementSibling表示input控件的下一个兄弟元素，因为这里是把紧挨着放在 后面的 this.image=e.target.files[0]; //这里是图片上传的时将文件数据赋值给this.image，可以放在方法外面 } } }
至此，若有纰漏，望各位不吝赐教
JavaScript图片预览
标签：element 预览 数据 url onload code ada targe new
原文地址：https://www.cnblogs.com/0nePlece/p/13233349.html
上一篇：Java 获取资源文件路径
评论
亲，登录后才可以留言！