layui table 数据表格固定列的行高和table其他列的行高不一致
1、问题描述:使用layui的table数据表格,固定某一列,这样表格中数据的宽度超出屏幕宽度时,固定列可以一直显示在屏幕中,不会随着底部滚动栏左右的拖动而变化位置。但是遇到一个问题,就是固定列的行高和其他非固定列的行高不一致,效果如下:

2、解决办法:在table的回调函数done中去处理,代码如下:
var tableIn = table.render({
elem: '#order-list',
url: '{:url("orderList")}',
method: 'post',
title: '{:lang("admin")}{:lang("orderList")}',
cols: [[
{field: 'city', title: '城市', minWidth: 130},
{field: 'order_sn', title: '订单编号', minWidth: 180},
]],
page: true,
done: function (res, curr, count) {
// 该方法用于解决,使用fixed固定列后,行高和其他列不一致的问题
$(".layui-table-main tr").each(function (index ,val) {
$($(".layui-table-fixed .layui-table-body tbody tr")[index]).height($(val).height());
});
}
});

3、修改好,刷新页面,效果如下:

4、大功告成!
layui table 数据表格固定列的行高和table其他列的行高不一致的更多相关文章
- LayUI之table数据表格获取行、行高亮等相关操作
前言 目前LayUI数据表格既美观有不乏一些实用功能.基本上表格应有的操作已经具备,LayUI作者[贤心]肯定是煞费苦心去优化,此处致敬.但是实话实话,如果单纯那数据表格功能来说,EasUI的数据表格 ...
- layui table 数据表格 隐藏列
现在国内的模板,也就layui一家独大了,其中的数据表格功能强大,但我不会用python或者django拼接json,输出发送给数据表格,那只好用笨办法,循环遍历吧. 数据表格中保留id列,是为了编辑 ...
- layui table数据表格reload where参数保留问题
layui table数据表格reload where参数保留问题 在使用layui过程中多多少少会遇到些问题 table reload 有个坑:reload时where参数会保留上次的参数,如果用 ...
- layui:数据表格如何合并单元格
layui.use('table', function () { var table = layui.table; table.render({ elem: '#applyTab' , url: '$ ...
- layui动态数据表格-分页
数据结构 $list = [ [,'], [,] ]; $json[; $json['; $json[; $json['data'] = $list; return json($json); 代码: ...
- layui的数据表格加上操作
数据表格加上操作. <script type="text/html" id="barDemo"> <a class="layui-b ...
- table数据表格添加checkbox进行数据进行两个表格左右移动。
<table class="table table-hover table-striped table-condensed newDateList"> <thea ...
- layui数据表格固定头部和第一列、colspan合并列
刚看到原型图的时候,纳尼?不是跟我开玩笑吧,小女子资历尚浅,还真没做过像这样的功能,然后就是各种找度娘,可是都没有找到合适的,很多都是行合并,真的是头疼呀!再纠结是用VUE实现还是用layui实现好, ...
- layui中,同一个页面动态加载table数据表格
效果图: 前端代码: <div class="layui-fluid" id="record-user" hidden="hidden" ...
随机推荐
- 使用 html5 FileReader 获取图片, 并异步上传到服务器 (不使用 iframe)
为什么80%的码农都做不了架构师?>>> 原理: 1.使用FileReader 读取图片的base64编码 2.使用ajax,把图片的base64编码post到服务器. 3.根据 ...
- FluxInterval实例及解析
为什么80%的码农都做不了架构师?>>> 序 本文主要研究下FluxInterval的机制 FluxInterval reactor-core-3.1.3.RELEASE-sou ...
- 01-复杂度2 Maximum Subsequence Sum
01-复杂度2 Maximum Subsequence Sum (25分) 时间限制:200ms 内存限制:64MB 代码长度限制:16kB 判题程序:系统默认 作者:陈越 单位:浙江大学 htt ...
- C++类的开发实战--班级成绩管理系统
#include<bits/stdc++.h> using namespace std; struct birth { int year,month,day; }; struct grad ...
- 图论--2-SAT--POJ 3905 Perfect Election
Perfect Election Time Limit: 5000MS Memory Limit: 65536K Total Submissions: 964 Acce ...
- P5960 差分约束算法模板
差分约束 差分约束,一般用来解决有\(n\)个未知数,\(m\)个不等式方程的问题,形如: \[\begin{cases} \ x_{a_1}-x_{b_1}\leq y_1\\ \ x_{a_2}- ...
- 用js写出一个漂亮的单选框选中效果
一般的input框比较简单,我们可以用JavaScript配合css背景图片定位让我们模拟写出一个点击选中效果 首先需要有个图片素材,当页面加载的时候是背景图片定位到左图,当我们点击图片的时候,背景图 ...
- POJ3734(矩阵快速幂)
\(假设现在到第i个积木\) \(红绿恰都是偶数a种方案,恰都是奇数为b种方案,一奇一偶为c种方案\) \(由此考虑i+1个积木的情况\) Ⅰ.一奇一偶的方案 \(如果第i层恰是奇数的情况,那么本次只 ...
- 牛客小白月赛16 小石的妹子 二分 or 线段树
牛客小白月赛16 这个题目我AC之后看了一下别人的题解,基本上都是线段树,不过二分也可以. 这个题目很自然就肯定要对其中一个进行排序,排完序之后再处理另外一边,另一边记得离散化. 怎么处理呢,你仔细想 ...
- 【Linux】1 创建目录:mkdir
mkdir命令用于创建目录,如同一路径下创建单个或多个目录.递归创建目录,但同路径下不能创建同名目录,且目录名区分大小写. [命令] mkdir [用途] 创建目录(单个目录/多个目录) [语法] m ...