github
/
layui
mirror of https://github.com/layui/layui
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

更新 upload 测试代码

pull/1292/head
贤心 1 year ago
parent
582f55089e
commit
fbb83b52fd
1 changed files with 91 additions and 91 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 182
      examples/upload.html

182
examples/upload.html
Unescape View File

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

Write Preview
Loading…
Cancel
Save