在微擎中使用自带的图片上传组件，有时在移动端需要单图上传，或者剪裁功能等等，需要原形函数，本文简要说明，详细参见微擎文档

HTML

<div class="mui-table-view-chevron">  
  <div class="mui-image-uploader">  
    <a href="javascript:;" class="mui-upload-btn mui-pull-right js-image-{$name}"></a>  
    <div class="mui-image-preview js-image-preview mui-pull-right"></div>  
  </div>  
</div>

JQUERY

//上传图片 -- 原形  
util.image($('.js-image-{$name}'), function(url){  
  $('.js-image-{$name}').parent().find('.js-image-preview').append('<input type="hidden" value="'+url.attachment+'" name="{$name}" /><img src="'+url.url+'" data-id="'+url.id+'" data-preview-src="" data-preview-group="__IMG_UPLOAD_{$name}" />');  
  if($('.js-image-{$name}').parent().find('img').length == 1){  
    util.toast('上传成功');  
  }else{  
    util.toast('上传失败');  
  }  
  }, {  
     crop : false,//是否剪裁  
     multiple : false,//是否多图上传 ---剪裁则此项必须为false  
     preview : '__IMG_UPLOAD_{$name}'  
  });

//删除图片  
$(document).on("click", ".mui-clearfix .js-submit", function (a) {  
   var b = $(document).find(".mui-slider-group .mui-active").index();  
   $(".mui-image-preview input").eq(b).remove();  
   $(".mui-image-preview img").eq(b).remove();  
   var i = mui.previewImage({footer: util.templates["image.preview.html"]});  
   i.close();  
});

单图指定 上传  HTML和JS 对应 class 名称即可 -  非常方便

HTML

<div>
    <button class="js-image-a">123</button>
</div>

JS

util.image($('.js-image-a'), function(url){
    console.log('img-a->',url);
    if(url.url){
        util.toast('上传成功');
    }else{
        util.toast('上传失败');
    }
}, {
    crop : false,//是否剪裁
    multiple : false,//是否多图上传 ---剪裁则此项必须为false
    preview : '__IMG_UPLOAD_{$name}'
});