syw-01

 

直接上代码。下面代码可以上传多个图片,亲测一次上传九张都没有问题,可以一次性获取九张图片的serverId分别用逗号隔开,但是会有一个BUG,就是wx.uploadImage只能点击一次,当选择图片成功后在点击选择图片后并没有进入wx.uploadImage方法里面,也就获取不到serverIds了。  往下看解决方案。

document.querySelector(\'#chooseImage\').onclick = function () {
wx.chooseImage({
count: 3,
success: function (res) {
images.localId = res.localIds;
/* alert(\'已选择 \' + res.localIds.length + \' 张图片\'); */
$("#faceImg").attr("src", res.localIds[0]);
$("#faceImg1").attr("src", res.localIds[1]);
$("#faceImg2").attr("src", res.localIds[2]);
wxuploadImage(res.localIds);
}
});
};

var mediaId = null;
var serverIds = null;
var i = 0;

function wxuploadImage(e) {

wx.uploadImage({
localId: e[i].toString(), // 需要上传的图片的本地ID,由chooseImage接口获得
isShowProgressTips: 1, // 默认为1,显示进度提示
success: function (res) {
// 上传序号,上传一张 累计 +1
i++;
//存储图片媒体ID,用,号分割
serverIds+=res.serverId+\',\';
alert(serverIds);
if(i<e.length){//本地图片ID 还没全部获取完图片媒体ID
//调用上传递归函数
wxuploadImage(e);
}else{

}
//mediaId = res.serverId; // 返回图片的服务器端ID

},
fail: function (error) {
picPath = \'\';
localIds = \'\';
alert(Json.stringify(error));

}

});
}

 

 

 

这样就可以等待上一张图片上传完成后在上传下一张图片

document.querySelector(\'#chooseImage\').onclick = function () {
wx.chooseImage({
count: 1,
sizeType: [\'compressed\'],
sourceType: [\'album\', \'camera\'],
success: function (res) {
images.localId = res.localIds;
/* alert(\'已选择 \' + res.localIds.length + \' 张图片\'); */
$("<p class=\'jiao\'></p><p class=\'pic image_container\'><img src="+res.localIds[0]+"></p>").appendTo("#faceImg");
//wxuploadImage(res.localIds);
syncUpload(res.localIds);
}
});
};

var syncUpload = function(localIds){
var localId = localIds.pop();
wx.uploadImage({
localId: localId,
isShowProgressTips: 1,
success: function (res) {
var serverId = res.serverId; // 返回图片的服务器端ID
//其他对serverId做处理的代码
if(localIds.length > 0){
syncUpload(localIds);
}
}
});
};

 

分类:

技术点:

相关文章: