html上传图片后预览选择的图片

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("请选择一个图片类型文件。");
            }
        });
    });

预览效果：