theluyuan/layui-js
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

publish

Browse Source
This commit is contained in:
贤心
2020-01-15 06:30:00 +08:00
parent c0f555adcf
commit fba6ab7cd2
51 changed files with 437 additions and 142 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
examples/flow.html
View File

@@ -18,7 +18,11 @@ img{width: 500px; height: 300px;}
<body>
<ul class="flow-default"></ul>
<ul class="flow-default" id="test1"></ul>
<div class="layui-hide">
<ul class="flow-default" id="test2"></ul>
</div>
<div class="demo" style="height: 200px; overflow: auto;">
@@ -41,13 +45,30 @@ layui.use('flow', function(){
var flow = layui.flow;
flow.load({
elem: '.flow-default' //流加载容器
elem: '#test1' //流加载容器
//,scrollElem: '.flow-default' //滚动条所在元素，默认document
//,isAuto: false
//,end: '没了'
,isLazyimg: true
,done: function(page, next){ //加载下一页
console.log('done:', page)
setTimeout(function(){
var lis = [];
for(var i = 0; i < 6; i++){
lis.push('<li><img lay-src="http://s6.mogucdn.com/p2/160914/iz_5lc1cdg3j2hibl9ai99lg7c28k1fh_305x330.jpg?v='+ (page+i) +'"></li>')
}
next(lis.join(''), page < 3);
}, 500);
}
});
flow.load({
elem: '#test2' //流加载容器
//,scrollElem: '.flow-default' //滚动条所在元素，默认document
//,isAuto: false
//,end: '没了'
,isLazyimg: true
,done: function(page, next){ //加载下一页
console.log(page)
setTimeout(function(){
var lis = [];
for(var i = 0; i < 6; i++){

32
examples/form.html
View File

@@ -273,41 +273,24 @@ layui.use(['form', 'layedit', 'laydate'], function(){
</script>
<form id="test">
<form id="test1" action="" target="_blank">
<input type="radio" value="girl" disabled>
<input type="checkbox" name="love[a]">
<input type="checkbox" name="love[b]">
<input value="1">
<input name="as">
<input name="=" value="2">
<select name="quiz">
<option value="">请选择问题</option>
<option disabled value="你工作的第一个城市">你工作的第一个城市</option>
<option value="你的工号">你的工号</option>
<option value="你最喜欢的老师">你最喜欢的老师</option>
<option value="你的工号">你的工号</option>
<option value="你的工号">你的工号</option>
<option value="你的工号">你的工号</option>
<option value="你的工号">你的工号</option>
<option value="你的工号">你的工号</option>
<option value="你的工号">你的工号</option>
<option value="你的工号">你的工号</option>
<option value="你的工号">你的工号</option>
<option value="你的工号">你的工号</option>
<option value="你的工号">你的工号</option>
<option value="你的工号">你的工号</option>
<option value="你的工号">你的工号</option>
<option value="你的工号">你的工号</option>
<option value="你的工号">你的工号</option>
<option value="你的工号">你的工号</option>
<option value="你的工号">你的工号</option>
<option value="你的工号">你的工号</option>
<option value="你的工号" selected>你的工号</option>
<option value="你的工号">你的工号</option>
<option value="你的工号">你的工号</option>
<option value="你的工号">你的工号</option>
</select>
<button>Go</button>
<button type="submit">原始表单，测试提交</button>
</form>
<script>
layui.use('jquery', function(){
var $ = layui.jquery;
@@ -317,8 +300,9 @@ layui.use('jquery', function(){
$('#test').on('submit', function(){
return false
});
$('#test').on('submit', function(){
return true
$('#test1').on('submit', function(obj){
//console.log(obj.field)
//return false;
});
});
</script>

4
examples/json/table/demo1.json
View File

@@ -2,6 +2,10 @@
"code": 0
,"msg": ""
,"count": 3000000
,"totalRow": {
"experience": "666"
,"logins": "999"
}
,"data": [{
"id": "10001"
,"username": "杜甫"

12
examples/upload.html
View File

@@ -16,7 +16,7 @@ hr{margin: 30px 0;}
<body>
<div class="layui-upload">
<button type="button" class="layui-btn" id="test1">上传图片</button>
<button type="button" class="layui-btn" id="test1" name="123">上传图片</button>
<div class="layui-upload-list">
<img class="layui-upload-img" src="" id="demo1">
@@ -94,7 +94,7 @@ layui.use(['upload', 'element'], function(){
var uploadInst = upload.render({
elem: '#test1'
,url: 'http://httpbin.org/image'
,url: 'http://httpbin.org/post'
//,size: 2000 //限制文件大小，单位 KB
//,accept: 'file'
,method: 'get'
@@ -122,6 +122,7 @@ layui.use(['upload', 'element'], function(){
return layer.msg('上传失败');
}
//上传成功
console.log(res);
}
,error: function(){
this.item.html('重选上传');
@@ -135,8 +136,8 @@ layui.use(['upload', 'element'], function(){
element.progress('demo', '0%');
}
,progress: function(n){
console.log(n + '%'); //获取进度百分比
,progress: function(n, index, e){
console.log(n + '%', index, e); //获取进度百分比
element.progress('demo', n + '%'); //可配合 layui 进度条元素使用
}
});
@@ -291,6 +292,7 @@ layui.use(['upload', 'element'], function(){
,choose: function(obj){
var that = this;
obj.preview(function(index, file){
console.log(file.name)
obj.resetFile(index, file, '123.jpg');
});
}
@@ -312,7 +314,7 @@ layui.use(['upload', 'element'], function(){
upload.render({
elem: '#test9'
,url: ''
,url: 'http://httpbin.org/post'
,done: function(res){
console.log(res);
}

28
examples/util.html
View File

@@ -17,6 +17,8 @@ body{padding: 50px;}
<button class="layui-btn" lay-active="e2">事件2</button>
<button class="layui-btn" lay-active="e3">事件3</button>
<button class="layui-btn" lay-active2="e4">事件4</button>
<hr>
<div id="test"></div>
@@ -60,14 +62,28 @@ layui.use('util', function(){
//处理属性 为 lay-active 的所有元素事件
util.event('lay-active', {
e1: function(){
alert('事件1')
e1: function(othis){
alert(othis.html())
}
,e2: function(){
alert('事件2')
,e2: function(othis){
alert(othis.html())
}
,e3: function(){
alert('事件3')
,e3: function(othis){
alert(othis.html())
}
});
//测试是否重复绑定
util.event('lay-active', {
e1: function(othis){
alert(othis.html() + '新事件')
}
});
//测试绑定新事件
util.event('lay-active2', {
e4: function(othis){
alert(othis.html())
}
});