最近做电商项目,遇到如下一个需求:
商品评价页面:用户上传图片,点击“”确定“”前,图片由前端实现base64转码(ps:由于商品评价页面可能存在多个产品,每个产品评价又可上传多张图片,所有前端img 转码可以有效的优化http请求,减小服务器的压力)
下面我们一步一步来看看demo代码:
(1)定义一个隐藏的input[type = 'file'],通过按钮触发其change事件
<center>
<!-- 图片上传表单 -->
<form>
<input type="file" class="file-hook" οnchange='PreviewImage(this)' style="display: none" />
</form>