纯牛奶645
纯牛奶645
  • 发布:2016-08-25 10:17
  • 更新:2021-02-09 10:21
  • 阅读:9944

上传多张照片到服务器

分类:HTML5+
        var server = **********; //上传文件的端口  
        var files = []; //文件的数组  
        document.getElementById("ContractID-btn").addEventListener('tap', function() {  
            plus.gallery.pick(function(e) {  
                document.getElementById("ContractID-btn").innerText = '选择照片(' + e.files.length + ')张';  
                //从相册添加文件  
                appendFile(e); //添加文件  
            }, function(e) {  
                // outSet("取消选择图片");  
            }, {  
                filter: "image",  
                multiple: true,  
                system: false  
            });  
        });  
        //上传文件  
        function uploadContract() {  
            var task = plus.uploader.createUpload(server, {  
                method: "POST"  
            }, function(t, status) {  
                if(status == 200) {  
                    plus.nativeUI.closeWaiting();  
                    mui.toast('上传成功');  
                    ContractZIP = JSON.parse(t.responseText).fileName;  
                    rowContract = JSON.parse(t.responseText).rawFiles;  
                } else {  
                    alert('上传失败,请重试');  
                }  
            });  
            task.addData("fileType", "合同");  
            task.addData("customerId", CustomerId);  
            for(var i = 0; i < files.length; i++) {  
                var f = files[i];  
                task.addFile(f.path, {  
                    key: f.name  
                });  
            }  
            task.start();  
        }  
        //添加文件            
        function appendFile(p) {  
            plus.nativeUI.showWaiting("正在上传...");  
            var index = 1;  
            files = []; //清空数组,防止重复上传  
            for(var i = 0; i < p.files.length; i++) {  
                var n = p.files[i].substr(p.files[i].lastIndexOf('/') + 1);  
                files.push({  
                    name: "uploadkey" + index,  
                    path: p.files[i]  
                });  
                index++;  
            }  
            uploadContract();//添加完文件,开始上传  
        }
0 关注 分享

要回复文章请先登录注册

1***@qq.com

1***@qq.com

有问题可以找我,一起学习吧

我的个人项目已经上线了,我使用的是七牛云存储(阿里也不错的),大概原理也一样吧,你们可以看看,很多功能都有了。

1、Android的(软著没申请下来,暂时上不了架):http://d.firim.top/tc7b?utm_source=fir&utm_medium=qrhttp://d.firim.top/tc7b?utm_source=fir&utm_medium=qr

2、iOS已经上架搜索:猫云—优质贴心的宠物平台

3、顺便也给你们给链接吧,例如iOS做唤起第三方或某个APP时可以使用到 https://apps.apple.com/cn/app/猫云-优质贴心的宠物社交平台/id1474103355
2021-02-09 10:21
m***@163.com

m***@163.com

//将文件集合添加到上传队列中
console.log("文件数量:"+files)
for (var i = 0; i < files.length; i++) {
var f = files[i];
task.addFile(f.src, {
key: f.name
});
}
//传其他的参数 如备注
//添加其他参数
//遍历5个input框

task.addData("name", "test");
task.start();
用了这个后端只能接受一张图片 MultipartHttpServletRequest
2019-03-05 10:39
7***@qq.com

7***@qq.com

能给一个demo学习下吗
2018-08-03 16:23
9***@qq.com

9***@qq.com

我这怎么用不了 有demo么
2017-12-07 09:37
纯牛奶645

纯牛奶645 (作者)

回复 距离您98米 :
multiple: 这个参数为true代表可以多选,false则只能选择一张
2017-06-08 16:03
距离您98米

距离您98米

回复 奔跑的蘑菇 :
如何 禁止 input file 只能选一个?
2017-06-07 18:35
奔跑的蘑菇

奔跑的蘑菇

回复 纯牛奶645 :
我也是用的这个,后来直接用原生做的
2017-05-08 20:56
纯牛奶645

纯牛奶645 (作者)

回复 mm炫酷 :
截个图让我看一下吧
2016-12-28 10:10
mm炫酷

mm炫酷

您好,为什么 iOS上传直接就是上传失败,请求都没 发送出去,Android可以正常上传,期待回答
2016-12-26 21:24
纯牛奶645

纯牛奶645 (作者)

回复 奔跑的蘑菇 :
multiple: true你看一下你这个参数是不是true
2016-12-12 17:52