diff --git a/examples/upload.html b/examples/upload.html index 3d8fd50c..8f2fe6bf 100644 --- a/examples/upload.html +++ b/examples/upload.html @@ -97,23 +97,23 @@ layui.use(['upload', 'element'], function(){ var element = layui.element; var uploadInst = upload.render({ - elem: '#test1' - ,url: 'https://httpbin.org/post' - //,size: 2000 //限制文件大小,单位 KB - //,accept: 'file' - ,method: 'get' - ,fileAccept: 'image/*' - ,exts: 'jpg|png|gif|bmp|jpeg|pdf' - ,data: { //额外参数 - a: 1 - ,b: function(){ + elem: '#test1', + url: 'https://httpbin.org/post', + // size: 2000, //限制文件大小,单位 KB + // accept: 'file', + method: 'get', + fileAccept: 'image/*', + exts: 'jpg|png|gif|bmp|jpeg|pdf', + data: { // 额外参数 + a: 1, + b: function(){ return 2 } - } - ,choose: function(obj){ + }, + choose: function(obj){ console.log('choose', obj); - } - ,before: function(obj){ + }, + before: function(obj){ //预读本地文件示例,不支持ie8 obj.preview(function(index, file, result){ $('#demo1').attr('src', result); //图片链接(base64) @@ -122,8 +122,8 @@ layui.use(['upload', 'element'], function(){ return; layer.msg('不允许上传') return false; - } - ,done: function(res, index){ + }, + done: function(res, index){ //如果上传失败 if(res.code > 0){ @@ -131,8 +131,8 @@ layui.use(['upload', 'element'], function(){ } //上传成功 console.log(res, index); - } - ,error: function(index, upload){ + }, + error: function(index, upload){ this.item.html('重选上传'); //演示失败状态,并实现重传 @@ -143,43 +143,43 @@ layui.use(['upload', 'element'], function(){ }); element.progress('demo', '0%'); - } - ,progress: function(n, elem, res, index){ + }, + progress: function(n, elem, res, index){ console.log(n + '%', elem, res, index); //获取进度百分比 element.progress('demo', n + '%'); //可配合 layui 进度条元素使用 } }); - //重置上述 upload 实例 + // 重置上述 upload 实例 uploadInst.reload({ - name:'avatar' - ,accept: 'images' //只允许上传图片 - ,acceptMime: 'image/*' //只筛选图片 + name:'avatar', + accept: 'images', // 只允许上传图片 + acceptMime: 'image/*', // 只筛选图片 //,size: 2 }); // 演示多图片上传 upload.render({ - elem: '#test2' - ,url: 'https://httpbin.org/post' - ,multiple: true // 多文件 - ,unified: true // 一起上传 --- 2.8.8+ - ,accept: 'images' - ,number: 3 //同时上传的数量 - ,size: 1024 - ,before: function(obj){ - //预读本地文件示例,不支持ie8 + elem: '#test2', + url: 'https://httpbin.org/post', + multiple: true, // 多文件 + unified: true, // 一起上传 --- 2.8.8+ + accept: 'images', + number: 3, // 同时上传的数量 + size: 1024, + before: function(obj){ + // 预读本地文件示例,不支持ie8 obj.preview(function(index, file, result){ $('#demo2').append(''+ file.name +'') }); // this.files = obj.pushFile(); - } - ,done: function(res, index){ + }, + done: function(res, index){ // 上传完毕 console.log(res, index) - } - ,allDone: function(obj){ + }, + allDone: function(obj){ console.log(obj) } }); @@ -187,16 +187,16 @@ layui.use(['upload', 'element'], function(){ // 演示多文件列表 --- 本示例仅演示未开启 unified 属性的情况 var demoListView = $('#demoList'); var uploadListIns = upload.render({ - elem: '#testList' - ,url: 'https://httpbin.org/post' - ,accept: 'file' - ,multiple: true - ,number: 3 - ,auto: false - ,bindAction: '#testListAction' - ,size: 30 - ,choose: function(obj){ - var files = this.files = obj.pushFile(); //将每次选择的文件追加到文件队列 + elem: '#testList', + url: 'https://httpbin.org/post', + accept: 'file', + multiple: true, + number: 3, + auto: false, + bindAction: '#testListAction', + size: 30, + choose: function(obj){ + var files = this.files = obj.pushFile(); // 将每次选择的文件追加到文件队列 //读取本地文件 obj.preview(function(index, file, result){ var tr = $(['' @@ -227,8 +227,8 @@ layui.use(['upload', 'element'], function(){ element.render('progress'); }); - } - ,done: function(res, index, upload){ + }, + done: function(res, index, upload){ //if(res.code == 0){ //上传成功 var tr = demoListView.find('tr#upload-'+ index) ,tds = tr.children(); @@ -237,16 +237,16 @@ layui.use(['upload', 'element'], function(){ return; //} this.error(index, upload); - } - ,allDone: function(obj){ + }, + allDone: function(obj){ console.log(obj) - } - ,error: function(index, upload){ + }, + error: function(index, upload){ var tr = demoListView.find('tr#upload-'+ index) ,tds = tr.children(); tds.eq(3).find('.demo-reload').removeClass('layui-hide'); //显示重传 - } - ,progress: function(n, elem, e, index){ + }, + progress: function(n, elem, e, index){ console.log(n); console.log(index); element.progress('progress-'+ index, n + '%'); //进度条 @@ -255,20 +255,20 @@ layui.use(['upload', 'element'], function(){ upload.render({ - elem: '.test333' - ,url: 'a' - ,accept: 'file' - ,before: function(obj){ + elem: '.test333', + url: 'a', + accept: 'file', + before: function(obj){ console.log(this.item); - } - ,done: function(res){ + }, + done: function(res){ console.log(res) } }); upload.render({ - elem: '.testm' - ,done: function(res, index, upload){ + elem: '.testm', + done: function(res, index, upload){ //获取当前触发上传的元素,一般用于 elem 绑定 class 的情况,注意:此乃 layui 2.1.0 新增 var item = this.item; } @@ -276,28 +276,28 @@ layui.use(['upload', 'element'], function(){ /* upload.render({ - elem: '#test33' - ,url: '' - ,accept: 'file' - ,done: function(res){ + elem: '#test33', + url: '', + accept: 'file', + done: function(res){ console.log(res) } });*/ upload.render({ - elem: '#test4' - ,url: '' - ,accept: 'video' - ,done: function(res){ + elem: '#test4', + url: '', + accept: 'video', + done: function(res){ console.log(res) } }); upload.render({ - elem: '#test5' - ,url: '' - ,accept: 'audio' - ,done: function(res){ + elem: '#test5', + url: '', + accept: 'audio', + done: function(res){ console.log(res) } }); @@ -305,39 +305,39 @@ layui.use(['upload', 'element'], function(){ //手动上传 upload.render({ - elem: '#test6' - ,url: '' - ,auto: false - //,multiple: true - ,bindAction: '#test7' - ,choose: function(obj){ + elem: '#test6', + url: '', + auto: false, + // multiple: true, + bindAction: '#test7', + choose: function(obj){ var that = this; obj.preview(function(index, file){ that.elem.after(''+ file.name +''); console.log(file.name); //obj.resetFile(index, file, '123.jpg'); }); - } - ,before: function(){ + }, + before: function(){ console.log(345); - } - ,done: function(res){ + }, + done: function(res){ console.log(res); } }); upload.render({ - elem: '#test8' - ,url: 'https://httpbin.org/post' - ,done: function(res){ + elem: '#test8', + url: 'https://httpbin.org/post', + done: function(res){ console.log(res); } }); upload.render({ - elem: '#test9' - ,url: '' - ,done: function(res){ + elem: '#test9', + url: '', + done: function(res){ console.log(res); } });