当表格行高动态发生变化时,固定列行高不变导致的表格错位问题
解决方法:
在layui-table加载完成的done回调函数中,动态监听table行高,添加以下代码
done: function (res, curr, count) {
$("[data-field='lowerHairPath']").css('display', 'none');
$(".layui-table-main tr").each(function (index, val) {
$($(".layui-table-fixed-l .layui-table-body tbody tr")[index]).height($(val).height());
$($(".layui-table-fixed-r .layui-table-body tbody tr")[index]).height($(val).height());
});
//动态监听表头高度变化,冻结行跟着改变高度
$(".layui-table-header tr").resize(function () {
$(".layui-table-header tr").each(function (index, val) {
$($(".layui-table-fixed .layui-table-header table tr")[index]).height($(val).height());
});
});
//初始化高度,使得冻结行表头高度一致
$(".layui-table-header tr").each(function (index, val) {
$($(".layui-table-fixed .layui-table-header table tr")[index]).height($(val).height());
});
//动态监听表体高度变化,冻结行跟着改变高度
$(".layui-table-body tr").resize(function () {
$(".layui-table-body tr").each(function (index, val) {
$($(".layui-table-fixed .layui-table-body table tr")[index]).height($(val).height());
});
});
//初始化高度,使得冻结行表体高度一致
$(".layui-table-body tr").each(function (index, val) {
$($(".layui-table-fixed .layui-table-body table tr")[index]).height($(val).height());
});
}