可以通过layui的table模块的cols属性中的hide属性来控制表格
字段的
显示和
隐藏。
例如，我们有一个id、name、age和email四个
字段的表格：
```html
<table id="demo" lay-filter="test"></table>
```
```javascript
layui.use('table', function(){
var table = layui.table;
table.render({
elem: '#demo',
url: '/demo/table/user/',
cols: [[
{field:'id', hide:true},
{field:'name', title: '姓名'},
{field:'age', title: '年龄'},
{field:'email', title: '邮箱'}
]]
});
});
```
在上述代码中，通过在cols属性中设置hide为true，即可将id
字段隐藏起来。
如果
需要动态控制表格
字段的
显示和
隐藏，可以使用table模块的reload方法重新渲染表格，并在cols属性中设置hide属性的值来控制表格
字段的
显示和
隐藏。
例如，我们定义一个按钮来控制表格中的id
字段的
显示和
隐藏：
```html
<div>
<button id="toggleBtn" class="layui-btn layui-btn-primary">
隐藏ID
字段</button>
</div>
<table id="demo" lay-filter="test"></table>
```
```javascript
layui.use('table', function(){
var table = layui.table;
table.render({
elem: '#demo',
url: '/demo/table/user/',
cols: [[
{field:'id', hide:true},
{field:'name', title: '姓名'},
{field:'age', title: '年龄'},
{field:'email', title: '邮箱'}
]]
});
$('#toggleBtn').on('click', function(){
var hideId = !table.config.cols[0][0].hide;
table.reload('demo', {
cols: [[
{field:'id', hide: hideId},
{field:'name', title: '姓名'},
{field:'age', title: '年龄'},
{field:'email', title: '邮箱'}
]]
});
$('#toggleBtn').text(hideId ? '
显示ID
字段' : '
隐藏ID
字段');
});
});
```
在上述代码中，我们定义了一个按钮，并在按钮的点击事件中调用了table模块的reload方法来重新渲染表格，并根据hideId的值来控制id
字段的
显示和
隐藏。同时，我们也修改了按钮的文本来反映当前id
字段的
显示状态。
7227
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
