使用scrollTop将Layui表格某一行置顶、居中、置底,与layui表格刷新后页面恢复,表格点击,选中一行

表格更改内容后会重新刷新,想要恢复原页面,目前只能做到reder后将某一行居中,置顶,说到底是CSS原理,本人CSS很烂,scrollTop用法可参考相关文章。恢复表格页面目前想要做到获取滚动后置顶的可视行的data-index,没有找到方法,有知道的求告知。使用scrollTop将Layui表格某一行置顶、居中、置底如下。如果获取滚动后置顶的data-index,那么恢复表格页面就很简单。


 //更新表格内容后,选中的居中(恢复原样的不知道怎么实现,读取当前置顶单元格的父级data-index) 
layui.table.on('tool(ydsd_yzyd_table)', async function (obj) {
        // 信息推送表格刷新后没有选中
        if (obj.event == "xxts") {



            let index = obj.data.NID - 1;
            let ID = obj.data.nub
            let dlmc = obj.data.dlmc
            let ydcs = obj.data.ydcs;
            let ydzs = obj.data.ydzs;
            let ydld_time = obj.data.stTime
            let ydld_cls = obj.data.ydcls
            let location = obj.data.location
            ydsd_yzyd_table.data[index].xxts = "疏导中";
//先render改变表格
            layui.table.render(ydsd_yzyd_table);

            //滚动到指定行
            console.log(index)

            //reder后置顶0.scrollTop(0-limit);行高(控制台查看)
            let limit = 30 * index
            // let h = 8
//置顶
            $(".layui-table-main").scrollTop(0 + limit);
//居中
            $(".layui-table-main").scrollTop(0 + limit - 8 / 2 * 30);
//弹出层自定义
            ydld_ld.popupTemplate = {
                content: SDpopupContent(dlmc, ydzs, ydld_time, ydld_cls, ydcs)

            }
//添加类(这里精确选择添加,否则所有layui表格只要是index行的都会添加改变样式)

             $("#table_tab_yzyd tr[data-index=" + index + "]").addClass(
                "layui-table-click"
            )
            //设置背景色和字体色 属性选择器

        }
        // 定位拥堵道路
        else {

        
        }
    });

点击选中行背景效果,不需要代码,直接加样式即可

.layui-table-click {
    background-color: #d1d5d7 !important;
   
}

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

先生余枫

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值