abstract:<!DOCTYPE html><html> <head> &nbs
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>layui</title>
<link rel="stylesheet" type="text/css" href="layui/css/layui.css">
<script type="text/javascript" src="layui/layui.js" ></script>
<style type="text/css">
.header span{background: #009688;color:#fff;margin-left: 30px;padding:10px;line-height: 32px;}
.header button{float:right;right:10px;}
.header{border-bottom: 2px solid #009688;}
body{padding:10px;}
</style>
</head>
<body>
<div class="header">
<span>管理員列表</span>
<button type="button" class="layui-btn layui-btn-sm" onclick="add()">添加</button>
</div>
<table class="layui-table" >
<thead>
<tr>
<th>ID</th>
<th >用戶名</th>
<th >性別</th>
<th >城市</th>
<th >籍貫</th>
<th >年薪</th>
<th >操作</th>
</tr>
</thead>
<tbody>
<tr>
<td>001</td>
<td>李小龍</td>
<td>男</td>
<td>香港</td>
<td>漢族</td>
<td>100萬</td>
<td>
<button type="button" class="layui-btn layui-btn-sm" onclick="add()">編輯</button>
<button type="button" class="layui-btn layui-btn-danger layui-btn-sm" onclick="del(this)">刪除</button>
</td>
</tr>
<tr>
<td>002</td>
<td>李連杰</td>
<td>男</td>
<td>香港</td>
<td>漢族</td>
<td>150萬</td>
<td>
<button type="button" class="layui-btn layui-btn-sm" onclick="add()">編輯</button>
<button type="button" class="layui-btn layui-btn-danger layui-btn-sm" onclick="del(this)">刪除</button>
</td>
</tr>
<tr>
<td>003</td>
<td>甄子丹</td>
<td>男</td>
<td>香港</td>
<td>漢族</td>
<td>200萬</td>
<td>
<button type="button" class="layui-btn layui-btn-sm" onclick="add()">編輯</button>
<button type="button" class="layui-btn layui-btn-danger layui-btn-sm" onclick="del(this)">刪除</button>
</td>
</tr>
<tr>
<td>004</td>
<td>趙文卓</td>
<td>男</td>
<td>香港</td>
<td>漢族</td>
<td>180萬</td>
<td>
<button type="button" class="layui-btn layui-btn-sm" onclick="add()">編輯</button>
<button type="button" class="layui-btn layui-btn-danger layui-btn-sm" onclick="del(this)">刪除</button>
</td>
</tr>
<tr>
<td>005</td>
<td>吳京</td>
<td>男</td>
<td>香港</td>
<td>漢族</td>
<td>300萬</td>
<td>
<button type="button" class="layui-btn layui-btn-sm" onclick="add()">編輯</button>
<button type="button" class="layui-btn layui-btn-danger layui-btn-sm" onclick="del(this)">刪除</button>
</td>
</tr>
</tbody>
</table>
<script>
//注意:折疊面板 依賴 element 模塊,否則無法進行功能性操作
layui.use('layer', function(){
$= layui.jquery;
var layer = layui.layer;
});
//退出
function logout(){
layer.confirm('確定退出碼?', {
btn: ['確定', '取消'] //可以無限個按鈕
}, function(index, layero){
}, function(index){
//按鈕【按鈕二】的回調(diào)
});
}
//編輯和增加
function add(){
layer.open({
type: 2,
title:'添加管理員',
area:['480px','420px'],
content: 'add.html' //這里content是一個普通的String
});
};
//刪除
function del(obj){
layer.confirm('確定刪除碼?', {
btn: ['確定', '取消'] //可以無限個按鈕
}, function(index, layero){
$(obj).parents('tr').remove();
layer.close(index);
}, function(index){
//按鈕【按鈕二】的回調(diào)
});
}
</script>
</body>
</html>
Correcting teacher:查無此人Correction time:2019-06-11 09:08:55
Teacher's summary:完成的不錯。layui封裝了很多js,多看文檔。繼續(xù)加油。