layui table 数据表格 隐藏列
现在国内的模板,也就layui一家独大了,其中的数据表格功能强大,但我不会用python或者django拼接json,输出发送给数据表格,那只好用笨办法,循环遍历吧。
数据表格中保留id列,是为了编辑修改的时候获取改行数据的id值,但又不需要展示出来,所以需要隐藏。
id列的代码是:
, cols: [[ //标题栏
{field: ,style:'display:none;'}
这个代码就可以把下面的id列的值隐藏起来,但标题栏的id还在,那么,问题来了,就用强大的jquery解决呗。
$('table.layui-table thead tr th:eq(0)').addClass('layui-hide');
当有多个表格的时候,发现上面的代码只能把第一个表的第一列标题栏给隐藏起来,如果一个页面有多个表格需要用:
$('table.layui-table thead tr th:nth-child(1)').addClass('layui-hide');
ok,完美解决。
哦,还有问题,如果表格中有选择框,默认会占据表格第一列,这个时候,上面的代码就出错了。只能推到,使用第一个代码,一个一个的选择。注意,layui的数据表格,自动会生成5个表格

我当前页面只有两个表格,一个常规,一个有选择框,搜索发现里面竟然有10个 <table 开头,所以隐藏列只能:
$('table:eq(1).layui-table thead tr th:eq(0)').addClass('layui-hide');
$('table:eq(6).layui-table thead tr th:eq(1)').addClass('layui-hide');
终于完结……
------------------------------------------------------------------------
jQuery :nth-child() 选择器
定义和用法
:nth-child(n) 选择器选取属于其父元素的不限类型的第 n 个子元素的所有元素。
提示:请使用 :nth-of-type() 选择器来选取属于其父元素的特定类型的第 n 个子元素的所有元素。
语法
| 参数 | 描述 |
|---|---|
| n | 要匹配的每个子元素的索引。
必须是一个数字。第一个元素的索引号是 1。 |
| even | 选取每个偶数子元素。 |
| odd | 选取每个奇数子元素。 |
| formula | 规定哪个子元素需通过公式 (an + b) 来选取。 实例:p:nth-child(3n+2) 选取每个第三段,从第二个子元素开始。 |
尝试一下 - 实例
选取所有 <div> 元素的第二个子元素的每个 <p> 元素
如何选取所有 <div> 元素的第二个子元素的每个 <p> 元素。
使用公式 (an + b)
如何使用公式 (an + b) 来选取不同的子元素。
使用"偶数"和"奇数"
如何使用偶数和奇数来选取不同的子元素。
:nth-child()、:nth-last-child()、:nth-of-type() 和 :nth-of-last-type() 之间的不同
p:nth-child(2)、p:nth-last-child(2)、p:nth-of-type(2) 和 p:nth-last-of-type(2) 之间的不同。
layui table 数据表格 隐藏列的更多相关文章
- layui table 数据表格固定列的行高和table其他列的行高不一致
1.问题描述:使用layui的table数据表格,固定某一列,这样表格中数据的宽度超出屏幕宽度时,固定列可以一直显示在屏幕中,不会随着底部滚动栏左右的拖动而变化位置.但是遇到一个问题,就是固定列的行高 ...
- layui table数据表格reload where参数保留问题
layui table数据表格reload where参数保留问题 在使用layui过程中多多少少会遇到些问题 table reload 有个坑:reload时where参数会保留上次的参数,如果用 ...
- 项目总结17-使用layui table分页表格
项目总结17-使用layui table分页表格总结 前言 在项目中,需要用到分页的表格来展示数据,发现layui的分页表格,是一个很好的选择:本文介绍layui table分页表格的前后端简单使用 ...
- Saiku设置展示table数据不隐藏空的行数据信息(二十六)
Saiku设置展示table数据不隐藏空的行数据信息 saiku有个 非空的字段 按钮,点击这个后,会自动的把空的行数据信息给隐藏掉,这里我们来设置一下让其行数据不隐藏,为空的就为空. 主要更改两个文 ...
- LayUI之table数据表格获取行、行高亮等相关操作
前言 目前LayUI数据表格既美观有不乏一些实用功能.基本上表格应有的操作已经具备,LayUI作者[贤心]肯定是煞费苦心去优化,此处致敬.但是实话实话,如果单纯那数据表格功能来说,EasUI的数据表格 ...
- layui中,同一个页面动态加载table数据表格
效果图: 前端代码: <div class="layui-fluid" id="record-user" hidden="hidden" ...
- layui:数据表格如何合并单元格
layui.use('table', function () { var table = layui.table; table.render({ elem: '#applyTab' , url: '$ ...
- SAP ABAP编程 Table Control动态隐藏列
在SAP DIALOG设计中,有时候须要动态的隐藏某些列,以下是方法. ***数据定义 CONTROLS: table_control TYPE TABLEVIEW USING SCREEN 0100 ...
- layui的数据表格加上操作
数据表格加上操作. <script type="text/html" id="barDemo"> <a class="layui-b ...
随机推荐
- Vector、List、LinkedList
Vector 遍历 Vector<String> vestor =new Vector<String>(); vestor.add("qq"); vesto ...
- SQL面试题及答案
我觉得里面有些答案是不正确的,请只作参考 Student(S#,Sname,Sage,Ssex) 学生表 S#:学号:Sname:学生姓名:Sage:学生年龄:Ssex:学生性别 Cour ...
- 哈尔滨理工大学软件与微电子学院第八届程序设计竞赛同步赛(高年级) Solution
A: Solved. 分别处理出每个%7后余数的数字个数,再组合一下 #include <bits/stdc++.h> using namespace std; #define ll lo ...
- 20145202马超 2016-2017-2 《Java程序设计》第8周学习总结
20145202马超 2016-2017-2 <Java程序设计>第8周学习总结 教材学习内容总结 第十四章 NIO与NIO2 NIO使用频道(channel)来衔接数据节点,对数据区的标 ...
- MySQL的GTID复制
从mysql5.6开始引入全局事务标识符(GTID),即每个事务都有一个唯一的标识符.服务器上的每个事务都被分配一个唯一的事务标识符,这是一个64位非零的数值,根据事务提交的顺序分配.GTID的构成是 ...
- SQL学习笔记二之MySQL的数据库操作
阅读目录 一 系统数据库 二 创建数据库 三 数据库相关操作 一 系统数据库 information_schema: 虚拟库,不占用磁盘空间,存储的是数据库启动后的一些参数,如用户表信息.列信息.权限 ...
- Spring注解@Value
本文参考自: https://blog.csdn.net/ryelqy/article/details/77453713 @Value能让我们在java代码中使用property文件的属性,使用@Va ...
- 20145314郑凯杰《网络对抗技术》可选实验 shellcode注入与Return-to-libc攻击实验
20145314郑凯杰<网络对抗技术>可选实验 shellcode注入与Return-to-libc攻击实验 1.0 实践内容 Return-to-libc攻击是一种特殊的缓冲区溢出攻击, ...
- LightOJ 1027 A Dangerous Maze(期望)
https://cn.vjudge.net/problem/LightOJ-1027 题意:有n扇门,每扇门有个时间ti,选择正数的门可以在ti后带你走出迷宫,负数的门会在ti后带你回到起点,然后重新 ...
- shell 判断字符串长度是否不为0
test.sh #!/bin/bash s1="" if test $s1 ;then echo "length is not zero" else echo ...
jQuery 选择器