这里首先默认你已经稍微浏览过微信的文档说明，并完成jdk的config流程。
然后直接把照片选择、上传的两个方法放出来：
function photoSelect(str, num){//照片选择，str为数据指向
num = !num? 1:num;//单次选择数量，num为空时，单选
wx.chooseImage({
count: num,//当num大于9，没有反应，打开调试状态会有超出上限的报错
sizeType: ['original', 'compressed'],
success: function (res) {
var localIds = res.localIds;
photoUpload(str, localIds);
}
});
}
function photoUpload(str, localIds){//照片上传
var localId = localIds.splice(0, 1);
//ios专用
if(localId.indexOf("wxlocalresource") != -1){
localId = localId.replace("wxlocalresource", "wxLocalResource");
}
//当不使用定时器的时候，连续上传1+照片后，会莫明其妙滴不再执行，迫不得已掏出定时器这个大杀器~
setTimeout(function(){
wx.uploadImage({//这个玩意一次只能上传一张图片
localId: localId.toString(),
isShowProgressTips: 1,
success: function(res){
var serverId = res.serverId;
photoSelectData[str].url(localId,serverId);//这个根据自己需求添加
//localIds没有传完，即回调函数继续上传
if(localIds.length >= 1){
photoUpload(str, localIds);
}
},
fail: function(res){
alert('照片上传失败，请稍后再试！');
}
})
},50);
}
功能测试环境是公众平台的测试号。
图片上传，当不使用定时器的时候，连续上传1+照片后，会莫明其妙滴不再执行，知道什么情况的，或者能不使用定时器解决的兄弟情告知我一声。
图片上传中，截取的localId需要使用toString()转换一下才能正确识别。
功能代码完成后，我们来看看数据的处理，分单选和多选两种情况，一起放出来(不含样式，具体使用，还得看具体需求)：
//标签
//单张上传样例
<a class="photo-select" data-id="firstPhoto">
<img src="" id="firstPhoto"/>
</a>
<a class="photo-select" data-id="secondPhoto">
<img src="" id="secondPhoto"/>
</a>
//多张上传样例
<div class="batch-upload">
<div class="batch-title">其他照片</div>
<div class="batch-pic" id="otherPhoto">
</div>
<a class="photo-select" data-id="otherPhoto" data-num="9">批量上传</a>
</div>
//微信config处理
wx.ready(function(){
$('.photo-select').click(function(){
var $this = $(this);
var str = $this.attr('data-id');
var num = $this.attr('data-num')?$this.attr('data-num'):null;
photoSelect(str, num);
});
});
wx.error(function(){
$('.photo-select').click(function(){
alert('微信权限获取失败，请稍后再试！');
});
});
//数据处理集合
//包括serverId的信息保存，是否有图片的状态判断，以及图片展示
photoSelectData = {
//单张上传
firstPhoto: {
serverId: '',
state: false,
url: function(data,serverId){
$('#firstPhoto').attr('src',data);
this.state = true;
this.serverId = serverId;
}
},
secondPhoto: {
serverId: '',
state: false,
url: function(data,serverId){
$('#firstPhoto').attr('src',data);
this.state = true;
this.serverId = serverId;
}
},
//批量上传
otherPhoto: {
serverId: [],
state: false,
url: function(data, serverId){
var html = '<div class="pic">'
+'<i class="pic-close" onclick="photoCancel('+"'otherPhoto'"+',this)"></i>'
+'<img src="'+data+'">'
+'</div>';
$('#otherPhoto').append(html);
this.serverId.push(serverId);
photoSelectData.batchState('otherPhoto');
},
//批量上传状态判断
batchState: function(str){
if(photoSelectData[str].serverId.length >= 1){
photoSelectData[str].state = true;
}else{
photoSelectData[str].state = false;
}
}
}
}
//多张上传的单张图片删除
function photoCancel(str, obj){
var $obj = $(obj).parent();
var $pic = $('#'+str+' .pic');
var index = $pic.index($obj);
$pic.eq(index).remove();
photoSelectData[str].serverId.splice(index,1);
photoSelectData.batchState(str);
}
