相逢一笑泯恩仇
layui的table使⽤不多bb，直接上代码
html的代码：
<link rel="stylesheet" href="../../static/layui/css/layui.css">
<script src="../../static/layui/layui.js"></script>
<script src="../../static/js/jquery.js"></script>
<table class="layui-hide" id="test" lay-filter="table"></table>
<script type="text/html" id="barDemo">
<a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
<!--<a class="layui-icon" lay-event="edit"></a>-->
<!--<a class="layui-icon" lay-event="del"></a>-->
</script>js的代码：
layui.u(['form','layer','table','upload'],function () {
var table = layui.table,
sui是哪个国家的缩写
layer = layui.layer;
elem:"#test",
引向器
url:"../json/data.json",
cellMinWidth:80,
candysoft
cols:[[
{type:'numbers'},
{field:'id',title:'id'},
{field:'urName',title:'⽤户名'},
{field:'password',title:'密码'},
{field:'nickName',title:'昵称'},
{field:'phone',title:'电话号码'},
{fixed: 'right',title: '操作', width:180, align:'center', toolbar: '#barDemo'} //绑定tpl表达式
]],
page:true,//开启分页
id:'testReload' //这个id挺重要的你对table做操作时候需要使⽤到⽐如reload的时候
});
<('tool(table)',function (obj) { //注：tool是⼯具条事件名，test是table原始容器的属性 lay-filter="对应的值" var data = obj.data; //获得当前⾏数据
var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
var tr = ; //获得当前⾏ tr 的DOM对象
if (layEvent === 'del'){
obj.del(); //删除对应⾏（tr）的DOM结构，并更新缓存
layer.clo(index);
//向服务端发送删除指令
});
}el if(layEvent === 'edit'){
layer.msg("我要编辑你了，怕不怕啊");
}
});
});
还有json⽂件：
{
"code":0,
"msg":"崩坏三好好玩",
"count":3,
previa"data":[
{"id":1,"urName":"黄楠楠","password":"111","nickName":"楠佬","phone":"181********"},
{"id":2,"urName":"齐浩宇","password":"111","nickName":"齐佬","phone":"181********"},
{"id":3,"urName":"祁剑雄","password":"111","nickName":"熊佬","phone":"181********"}
]
}
最后的出来的效果：
今天就先到这⾥把，等这个星期双休的时候，再研究下。
layui的静态表格
<!DOCTYPE html>
<html lang="en">
<head>
<meta chart="UTF-8">
<title>Title</title>
<script src="../../static/layui/layui.js"></script>
<script src="../../static/js/jquery.js"></script>
<link rel="stylesheet" href="../../static/layui/css/layui.css">
</head>
<body>
<div >
<table class="layui-table" lay-even="" lay-skin="nob">
<table class="layui-table" lay-skin="line">
<colgroup>
<col width="150">
<col width="150">
<col width="200">
<col>
</colgroup>
<thead>
<tr>
<th>⼈物</th>
<th>民族</th>
<th>出场时间</th>
<th>格⾔</th>
</tr>
</thead>
<tbody>
<tr>
条款英文
<td>贤⼼</td>
<td>汉族</td>
<td>1989-10-14</td>
<td>⼈⽣似修⾏</td>
</tr>
<tr>
<td>张爱玲</td>
<td>汉族</td>
<td>1920-09-30</td>
<td>于千万⼈之中遇见你所遇见的⼈，于千万年之中，时间的⽆涯的荒野⾥…</td> </tr>
<tr>
<td>Helen Keller</td>
<td>拉丁美裔</td>
<td>1880-06-27</td>
<td> Life is either a daring adventure or nothing.</td>
</tr>
<tr>
<td>岳飞</td>
<td>汉族</td>
<td>1103-北宋崇宁⼆年</td>
<td>教科书再滥改，也抹不去“民族英雄”的事实</td>
</tr>
<tr>
<td>孟⼦</td>
<td>华夏族（汉族）</td>
<td>公元前-372年</td>
<td>猿强，则国强。国强，则猿更强！</td>
</tr>
</tbody>winter是什么意思
</table>
</table>
生活大爆炸第2季
</div>
小儿英语<script>
pubmed home
var table = layui.table;
</script>
</body>
</html>
