简单实现图片上传预览
Posted 徐海峰
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了简单实现图片上传预览相关的知识，希望对你有一定的参考价值。
/*-----Title-----*/
<script type="text/javascript" src="Script/jquery-1.4.1.min.js"></script>
/*-----JQuery-----*/
<script type="text/javascript">
$(function () {
$(‘.selectPic‘).change(function () {
$(".previewPic").attr("src", "Content/Loading.gif");
var _file = this.files[0]; //选择上传的文件
var r = new FileReader();
r.readAsDataURL(_file); //Base64
$(r).load(function () {
$(".previewPic").attr("src", this.result);
});
});
});
</script>
/*-----Page-----*/
<div class="selectArea">
<span>选择图片 >></span>
<asp:FileUpload ID="FileUpload1" runat="server" accept="image/*" CssClass="selectPic" />
</div>
<div class="previewArea">
<asp:Image runat="server" ID="Image1" CssClass="previewPic" />
</div>
以上是关于简单实现图片上传预览的主要内容，如果未能解决你的问题，请参考以下文章
react利用await/async实现批量上传图片可预览可限制上传图片数量