【layui】使用table编辑功能，滚动条位置固定不变，无感刷新

IT从业者的职业生涯

于 2019-11-25 14:42:31 发布

阅读量1.3k

点赞数 2

文章标签： layui 前端 javascript html css

本文链接：https://blog.csdn.net/qq_20314665/article/details/128483066

版权

使用table 单元格编辑功能时，每次里焦触发成功后手动调用了table.reload函数，导致滚动条初始化到顶部。

在表格编辑后，表格刷新前先记录滚动条位置

var scrollTop = ($('.layui-table-body') && $('.layui-table-body').length > 1) ? $('.layui-table-body')[0].scrollTop : $('.layui-table-body').scrollTop;
var scrollLeft = ($('.layui-table-body') && $('.layui-table-body').length > 1) ? $('.layui-table-body')[0].scrollLeft : $('.layui-table-body').scrollLeft;

activeData.tableScroll.scrollTob = scrollTop == 0 ? activeData.tableScroll.scrollTob : scrollTop;
activeData.tableScroll.scrollLeft = scrollLeft;

在table 的done函数中进行表格滚动

done: function () {
        $('.layui-table-body').scrollTop(activeData.tableScroll.scrollTob);
        $('.layui-table-body').scrollLeft(activeData.tableScroll.scrollLeft);
        activeData.tableScroll.scrollTob = 0;
        activeData.tableScroll.scrollLeft = 0;
  }