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

1.0.5

Browse Source
This commit is contained in:
sentsin
2016-11-29 07:36:58 +08:00
parent 087fcb1290
commit 1e8bd1496c
41 changed files with 852 additions and 679 deletions
Download Patch File Download Diff File Expand all files Collapse all files

35
test/element.html
View File

@@ -47,7 +47,7 @@ body{padding: 10px;}
<a href="javascript:;">解决方案</a>
<dl class="layui-nav-child">
<dd><a href="">移动模块</a></dd>
<dd><a href="">后台模版</a></dd>
<dd class="layui-this"><a href="">后台模版</a></dd>
<dd><a href="">电商平台</a></dd>
</dl>
</li>
@@ -56,19 +56,16 @@ body{padding: 10px;}
<br><br>
<ul class="layui-nav layui-nav-tree">
<li class="layui-nav-item"><a href="">最新活动</a></li>
<li class="layui-nav-item layui-nav-itemed layui-this">
<ul class="layui-nav layui-nav-tree" lay-filter="test">
<li class="layui-nav-item layui-nav-itemed">
<a class="" href="javascript:;">产品</a>
<dl class="layui-nav-child">
<dd><a href="">移动模块</a></dd>
<dd><a href="">后台模版</a></dd>
<dd><a href="">电商平台</a></dd>
<dd><a href="javascript:;">移动模块</a></dd>
<dd><a href="javascript:;">后台模版</a></dd>
<dd><a href="javascript:;">电商平台</a></dd>
<dd><a href="">跳转菜单</a></dd>
</dl>
</li>
<li class="layui-nav-item"><a href="">大数据</a></li>
<li class="layui-nav-item"><a href="">云市场</a></li>
<li class="layui-nav-item">
<a href="javascript:;">解决方案</a>
<dl class="layui-nav-child">
@@ -77,6 +74,7 @@ body{padding: 10px;}
<dd><a href="">电商平台</a></dd>
</dl>
</li>
<li class="layui-nav-item"><a href="">云市场</a></li>
<li class="layui-nav-item"><a href="">社区</a></li>
</ul>
@@ -104,7 +102,7 @@ body{padding: 10px;}
<br><br>
<div class="layui-tab" lay-filter="tabDemo">
<div class="layui-tab" lay-filter="tabDemo" lay-allowClose="true">
<ul class="layui-tab-title">
<li class="layui-this">标题1</li>
<li>标题2</li>
@@ -113,12 +111,7 @@ body{padding: 10px;}
<li>标题5</li>
</ul>
<div class="layui-tab-content">
<div class="layui-tab-item layui-show">
1
<br><button class="layui-btn" onclick="layui.element().tabChange('tabDemo', 2)">手工切换到第三项</button>
<button class="layui-btn" onclick="layui.element().tabAdd('tabDemo', {title:'新标题', content:'新内容'})">添加Tab</button>
<button class="layui-btn" onclick="layui.element().tabDelete('tabDemo', 3)">删除第四项</button>
</div>
<div class="layui-tab-item layui-show">1</div>
<div class="layui-tab-item">2</div>
<div class="layui-tab-item">3</div>
<div class="layui-tab-item">4</div>
@@ -126,6 +119,10 @@ body{padding: 10px;}
</div>
</div>
<button class="layui-btn" onclick="layui.element().tabChange('tabDemo', 2)">手工切换到第三项</button>
<button class="layui-btn" onclick="layui.element().tabAdd('tabDemo', {title:'新标题', content:'新内容'})">添加Tab</button>
<button class="layui-btn" onclick="layui.element().tabDelete('tabDemo', 3)">删除第四项</button>
<div class="layui-tab layui-tab-brief">
<ul class="layui-tab-title">
<li class="layui-this">标题1</li>
@@ -182,6 +179,10 @@ layui.use('element', function(){
element.on('tab(test)', function(data){
console.log(this, data);
});
element.on('nav(test)', function(elem){
console.log(elem)
});
});
</script>
</body>

11
test/flow.html
View File

@@ -18,12 +18,7 @@ img{width: 500px; height: 300px;}
<body>
<ul class="flow-default">
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
</ul>
<ul class="flow-default"></ul>
<div class="demo" style="height: 200px; overflow: auto;">
@@ -48,7 +43,7 @@ layui.use('flow', function(){
elem: '.flow-default' //流加载容器
//,scrollElem: '.flow-default' //滚动条所在元素，默认document
//,isAuto: false
//,isShowEnd: false
//,end: '没了'
,isLazyimg: true
,done: function(page, next){ //加载下一页
console.log(page)
@@ -57,7 +52,7 @@ layui.use('flow', function(){
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 > 5 ? 0 : 11);
next(lis.join(''), page < 3);
}, 500);
}
});

1
test/json/layim/getList.json
View File

@@ -33,6 +33,7 @@
,"id": "168168"
,"avatar": "http://tp4.sinaimg.cn/2145291155/180/5601307179/1"
,"sign": "让天下没有难写的代码"
,"status": "offline"
},{
"username": "徐小峥"
,"id": "666666"

122
test/table.html
View File

@@ -15,36 +15,130 @@ body{padding: 10px;}
<table class="layui-table">
<colgroup>
<col width="150">
<col width="200">
<col>
</colgroup>
<thead>
<tr>
<th>名称</th>
<th>组合</th>
<th>昵称</th>
<th>加入时间</th>
<th>签名</th>
</tr>
</thead>
<tbody>
<tr>
<td style="text-align: center;">原始</td>
<td>class="layui-btn layui-btn-primary"</td>
<td>贤心</td>
<td>2016-11-29</td>
<td>人生就像是一场修行</td>
</tr>
<tr>
<td style="text-align: center;">默认</td>
<td>class="layui-btn"</td>
<td>贤心</td>
<td>2016-11-29</td>
<td>人生就像是一场修行</td>
</tr>
<tr>
<td style="text-align: center;">百搭</td>
<td>class="layui-btn layui-btn-normal"</td>
<td>贤心</td>
<td>2016-11-29</td>
<td>人生就像是一场修行</td>
</tr>
</tbody>
</table>
<table class="layui-table" lay-skin="line">
<colgroup>
<col width="150">
<col width="200">
<col>
</colgroup>
<thead>
<tr>
<th>昵称</th>
<th>加入时间</th>
<th>签名</th>
</tr>
</thead>
<tbody>
<tr>
<td>贤心</td>
<td>2016-11-29</td>
<td>人生就像是一场修行</td>
</tr>
<tr>
<td style="text-align: center;">暖色</td>
<td>class="layui-btn layui-btn-warm"</td>
<td>贤心</td>
<td>2016-11-29</td>
<td>人生就像是一场修行</td>
</tr>
<tr>
<td style="text-align: center;">警告</td>
<td>class="layui-btn layui-btn-danger"</td>
<td>贤心</td>
<td>2016-11-29</td>
<td>人生就像是一场修行</td>
</tr>
</tbody>
</table>
<table class="layui-table" lay-skin="row">
<colgroup>
<col width="150">
<col width="200">
<col>
</colgroup>
<thead>
<tr>
<th>昵称</th>
<th>加入时间</th>
<th>签名</th>
</tr>
</thead>
<tbody>
<tr>
<td>贤心</td>
<td>2016-11-29</td>
<td>人生就像是一场修行</td>
</tr>
<tr>
<td style="text-align: center;">禁用</td>
<td>class="layui-btn layui-btn-disabled"</td>
<td>贤心</td>
<td>2016-11-29</td>
<td>人生就像是一场修行</td>
</tr>
<tr>
<td>贤心</td>
<td>2016-11-29</td>
<td>人生就像是一场修行</td>
</tr>
</tbody>
</table>
<table class="layui-table" lay-even lay-skin="nob">
<colgroup>
<col width="150">
<col width="200">
<col>
</colgroup>
<thead>
<tr>
<th>昵称</th>
<th>加入时间</th>
<th>签名</th>
</tr>
</thead>
<tbody>
<tr>
<td>贤心</td>
<td>2016-11-29</td>
<td>人生就像是一场修行</td>
</tr>
<tr>
<td>贤心</td>
<td>2016-11-29</td>
<td>人生就像是一场修行</td>
</tr>
<tr>
<td>贤心</td>
<td>2016-11-29</td>
<td>人生就像是一场修行</td>
</tr>
</tbody>
</table>