html代码:
<img class="setting-avatar" id="readerAvatar" src="" alt="">
<input type="file" class="form-control m-t-5" id="avatar" name="avatar">
js代码:
$(function (){ $('#avatar').on('change', function() { let fileReader = new FileReader(), files = this.files, file; if (!files.length) return; file = files[0]; if(/^image\/\w+$/.test(file.type)) { fileReader.readAsDataURL(file); fileReader.onload = function() { $('#readerAvatar').attr('src', this.result); }; }else{ tip_error("请选择一个图片类型文件。"); } }); });
预览效果:
标签:files,function,预览,fileReader,html,file,图片 From: https://www.cnblogs.com/wjs2019/p/18315981