JS实现选择图片后预览

<div class="layui-form-item">
            <label class="layui-form-label">上传照片</label>
            <div class="layui-input-block">
                   <img width="165" height="180" id="prevView" src="static/img/up.jpg"/>
                   <input type="file" id="file" name="file" onchange="prev(this)"
          style="height:180px;width:165px;opacity:0;cursor:pointer;position: absolute;
top: 0;left: 0;z-index: 9;" />
            </div>
        </div>

<script type="text/javascript">
    function prev(event){
        //获取展示图片的区域
        var img = document.getElementById("prevView");
        //获取文件对象
        let file = event.files[0];
        //获取文件阅读器
        let reader = new FileReader();
        reader.readAsDataURL(file);
        reader.onload = function(){
            //给img的src设置图片url
            img.setAttribute("src", this.result);
        }
        img.style.display=block;
    }
</script>

效果：