MUI+Hbuilder之多图片,单图片上传(五)
2018-12-17 本文已影响0人
喵呜Yuri
按钮
<div class="img-item btn" id="uploadImg"></div>
js:
document.getElementById("uploadImg").addEventListener("tap", function() {
var editButtons = new Array();
if(vm.uploadImgArr.length < 9) {
editButtons.push({
title: "拍照上传",
style: "default"
});
editButtons.push({
title: "从相册选择",
style: "default"
});
plus.nativeUI.actionSheet({
cancel: "取消",
buttons: editButtons
}, function(e) {
var index = e.index;
switch(index) {
case 1:
captureImage(); //拍照
break;
case 2:
selectImage(); //相册选择
break;
}
});
}else{
mui.toast("最多选择九张图片");
}
});
//选择图片
function selectImage() {
plus.gallery.pick(function(path) {
loadImage(path);
}, function(e) {
mui.toast("没有选择图片");
},{
filter:'image',
multiple: true,
system: false
});
}
//确定选择图片
function loadImage(path) {
console.log(path);//多图片数组{"files":["file:///storage/emulated/0/Huawei/MagazineUnlock/magazine-unlock-01-2.3.1197-_235C89AFABD8044D447E369EA1CBD603.jpg","file:///storage/emulated/0/Huawei/MagazineUnlock/magazine-unlock-01-2.3.1197-_B6EE3C9D1FC9834884A25F0C070D43F1.jpg"]} at view/faultrepair/setfaultrepair.html:198
...
}
主要方法在 selectImage()和 loadImage(path)里面
单图片上传:
function selectImage() {
plus.gallery.pick(function(path) {
loadImage(path);
}, function(e) {
mui.toast("没有选择图片");
});
}
//确定选择图片
function loadImage(path) {
console.log(path);//单个图片路径"file:///storage/emulated/0/Huawei/MagazineUnlock/magazine-unlock-01-2.3.1197-_235C89AFABD8044D447E369EA1CBD603.jpg"
...
}