问题描述:
在弹框中的表格,表格设置height属性
如果表格数据太多,表头会固定,只有表内容会滚动
拖动弹框右下角缩放弹框时,表格的头部对不齐
正常显示如图:
缩放之后如图:
解决办法:
layer有一个resizing属性,是弹框缩放结束的回调放方法
在回调之后重新根据数据列设置表头的宽度。
resizing: function (layero) { var tableDom = layero.find(‘.layui-table-box‘); var theadTable = tableDom.find(‘.layui-table-header‘); var tbodyTable = tableDom.find(‘.layui-table-body‘); tbodyTable.css({ ‘overflow‘: ‘auto‘ }); theadTable.css(‘width‘, ‘auto‘); theadTable.find(‘table‘).css(‘width‘, ‘auto‘); var tbodyTrTable = tbodyTable.find(‘tr‘).eq(0); if (tbodyTrTable.length != 0) { theadTable.find(‘th‘).each(function (i) { var tdDom = tbodyTrTable.find(‘td‘).eq(i); $(this).css({ ‘width‘: tdDom.outerWidth(true) + ‘px‘ }); }); } else { theadTable.find(‘table‘).css(‘width‘, ‘100%‘); } tableDom.find(‘.layui-form‘).css(‘height‘, tbodyTable.outerHeight(true) + theadTable.outerHeight(true) + ‘px‘); }
原文地址:https://www.cnblogs.com/kcat/p/10825110.html
时间: 2024-10-09 08:31:43