上传图片时，如何将图片实时显示出来？

<div class="form-group">
    <label for="exampleInputFile">{{ form.img.label.text }}</label>
    {{ form.img }}
    <img src="#" id="showImg" style="height: 200px;display: none;"/>
</div>

<script>
    $('#img').on('change', function () {//当chooseImage的值改变时，执行此函数
        var filePath = $(this).val(), //获取到input的value，里面是文件的路径
        fileFormat = filePath.substring(filePath.lastIndexOf(".")).toLowerCase(),
        src = window.URL.createObjectURL(this.files[0]); //转成可以在本地预览的格式
        // 检查是否是图片
        if (!fileFormat.match(/.png|.jpg|.jpeg/)) {
            alert('上传错误,文件格式必须为：png/jpg/jpeg');
            return;
        } else {
            $('#showImg').css('display', 'block');
            $('#showImg').attr('src', src);
        }
    });
</script>

同学，你好。同学可以在页面中使用img标签将图片显示出来。同学可以参考"https://www.pianshen.com/article/3951322566/"博客中的方法实现效果

如果我的回答解决了您的疑惑，请采纳！祝学习愉快~~~~~