可以通过
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字段的显示状态。
1031
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
