html代码如下
<div class="col-sm-10"> ????<input type="file" class="form-control shenfen" > ????<img class="shenfen_img" width="200" src=""> </div>
jq代码如下
<script> ?????$(function(){ ???????????$(".shenfen").on(‘change‘, function () { ?????????????????if (typeof (FileReader) != "undefined") { ?????????????????????????var img = $(this).siblings(".shenfen_img"); ?????????????????????????var reader = new FileReader(); ?????????????????????????reader.onload = function (e) { ???????????????????????????????img.attr("src",e.target.result) ?????????????????????????} ??????????????????????????reader.readAsDataURL($(this)[0].files[0]); ??????????????????} else { ??????????????????????????alert("你的浏览器不支持FileReader."); ??????????????????} ????????????}); ??????})</script>
预览效果如下:
flie文件上传图片预览
原文地址:https://www.cnblogs.com/xiaokele1314/p/9264141.html