基于zepto.js简单实现上传图片

<div class="otherPic">
    <div id="showOtherImage"></div>
    <span class="pull-left position_relative" id="openIdCardImg">
    <span class="icon color-blue addPic">&#xe647;</span>
    <input type="file" class="yy_inputFile" id="other_inputFile" name="reasonImg" />
    </span>
   </div>

.basicInfo .item{ padding:.5rem .5rem 0; border-top:.3rem solid #eeeeee;}
.basicInfo li{ overflow:hidden; margin-bottom:.5rem;line-height:2.1rem; border-bottom:1px solid #e3e3e3;}
.basicInfo li:last-child{ border-bottom:none;}
.basicInfo input[type="text"]{ height:2rem; line-height:2rem;}
.basicInfo textarea{ height:8rem; line-height:1.5rem;}
.basicInfo .otherPic{ min-height:3rem;}
.basicInfo .otherPic .addPic{ height:3rem; line-height:3rem; font-size:3rem; margin-bottom:.5rem;}
.basicInfo .otherPic img{ margin:0 .5rem .5rem 0; width:3rem; height:3rem; vertical-align:top; border:1px solid #ddd;}
.basicInfo .yy_inputFile{ position:absolute; top:0; left:0; width:3rem; height:3rem; opacity:0;}
.basicInfo .aboutPic{ margin-bottom:.5rem; line-height:1.5rem; }

var img_arr = new Array();
 //相关图片
 $(page).on('change','#other_inputFile',function () {
  $(this).resizeImage({
  that:this,
  cutWid:'',
  quality:0.6,
  limitWid:710,
  success:function (data) {
   var len = $('#showOtherImage').find('img').size();
   img_arr[len] = data.base64;
   var img = '<div class="position_relative display-inlineBlock" style="float:left;">' +
   '<img src="/UploadFiles/2021-04-02/' + img_arr[len] + '">

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持。