在
layui 数据表格中，删除
行的实现可以通过以下步骤完成：
1. 首先需要给
数据表格添加一个
监听事件，
监听删除操作：
```
table.on('tool(test)', function(obj){
var data = obj.data;
if(obj.event === 'del'){
layer.confirm('真的删除
行么', function(index){
obj.del(); //删除对应
行（tr）的DOM结构，并更新缓存
layer.close(index);
//向服务端发送删除指令
});
} else if(obj.event === 'edit'){
//编辑操作
}
});
```
2. 在
监听事件中，当
点击删除按钮时，弹出确认框询问是否真的要删除该
行数据，如果确认删除，则调用 obj.del() 方法删除对应
行的 DOM 结构，并更新缓存。
3. 如果需要向服务端发送删除指令，可以在确认删除后，通过 ajax 请求向服务端发送删除请求。
完整代码示例：
```
<
table class="
layui-
table" lay-data="{id:'test'}" lay-filter="test">
<thead>
<tr>
<th lay-data="{field:'id', width:80}">ID</th>
<th lay-data="{field:'username', width:120}">用户名</th>
<th lay-data="{field:'email', width:150}">邮箱</th>
<th lay-data="{field:'sex', width:80, sort:true}">性别</th>
<th lay-data="{field:'city', width:100}">城市</th>
<th lay-data="{field:'sign', width:200}">签名</th>
<th lay-data="{field:'experience', width:100, sort:true}">积分</th>
<th lay-data="{field:'score', width:100, sort:true}">评分</th>
<th lay-data="{field:'classify', width:100}">职业</th>
<th lay-data="{field:'wealth', width:150, sort:true}">财富</th>
<th lay-data="{fixed: 'right', width:165, align:'center', toolbar: '#barDemo'}"></th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>张三</td>
<td>test@test.com</td>
<td>男</td>
<td>北京</td>
<td>这是一段签名</td>
<td>1000</td>
<td>99</td>
<td>工程师</td>
<td>100000</td>
<td><button class="
layui-btn
layui-btn-xs" lay-event="edit">编辑</button><button class="
layui-btn
layui-btn-danger
layui-btn-xs" lay-event="del">删除</button></td>
</tr>
<tr>
<td>2</td>
<td>李四</td>
<td>test@test.com</td>
<td>女</td>
<td>上海</td>
<td>这是一段签名</td>
<td>2000</td>
<td>98</td>
<td>设计师</td>
<td>50000</td>
<td><button class="
layui-btn
layui-btn-xs" lay-event="edit">编辑</button><button class="
layui-btn
layui-btn-danger
layui-btn-xs" lay-event="del">删除</button></td>
</tr>
</tbody>
</
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>
</script>
<script>
layui.use('
table', function(){
var
table =
layui.
table;
//
监听工具条
table.on('tool(test)', function(obj){
var data = obj.data;
if(obj.event === 'del'){
layer.confirm('真的删除
行么', function(index){
obj.del(); //删除对应
行（tr）的DOM结构，并更新缓存
layer.close(index);
//向服务端发送删除指令
});
} else if(obj.event === 'edit'){
//编辑操作
}
});
});
</script>
```
最低0.47元/天 解锁文章
4031
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
