标签：图片 span fun 显示 gif read 获取文件信息 bsp result
写一些上传文件的程序时我们想把刚刚上传的图片显示在页面上，这个该如何实现呢？
首先我们先写HTML这里注意form标签必须带有 enctype="multipart/form-data" 这个属性，不然文件是上传不了的
<div class="row cl"> <label class="form-label col-xs-4 col-sm-2">文章缩略图：</label> <div class="formControls col-xs-8 col-sm-9"> <img id="uploadimg" style="max-width: 200px;display: block;" alt=""> //这里我们隐藏了一个img标签，为了等一下js处理 <input type="file" class="input-text" value="" placeholder="" id="picurl" name="picurl"> </div> </div>
接下来我写js代码 （我使用的是jQuery框架）
$("#picurl").on("change",function (e) { //当我们选择文件给表单时触发的事件
var file = e.target.files[0]; //获取文件信息
var fileRead = new FileReader(); //新建一个文件对象获取文件信息
fileRead.readAsDataURL(file);
fileRead.onload=function () {
$("#uploadimg").show(); //这里我们可以吧之前隐藏的img标签显示出来
$("#uploadimg").attr(‘src‘,this.result); //然后获取url给img
}
})
标签：图片 span fun 显示 gif read 获取文件信息 bsp result
原文地址：https://www.cnblogs.com/duansong/p/12184413.html
