js 固定列

最新推荐文章于 2021-06-04 18:34:04 发布

王小扣

最新推荐文章于 2021-06-04 18:34:04 发布

阅读量927

点赞数

分类专栏： JavaScript

本文链接：https://blog.csdn.net/qq_29150765/article/details/85159985

版权

JavaScript 专栏收录该内容

31 篇文章 0 订阅

订阅专栏

fixColum: function (ids) {
    $("#" + ids).scroll(function () {//给table外面的div滚动事件绑定一个函数
        var left = $(this).scrollLeft();//获取滚动的距离
        var trs = $("#"+ids+" table tr");//获取表格的所有tr
        trs.each(function (i) {//对每一个tr（每一行）进行处理
            //获得每一行下面的所有的td，然后选中下标为0的，即第一列，设置position为相对定位
            //相对于父div左边的距离为滑动的距离，然后设置个背景颜色，覆盖住后面几列数据滑动到第一列下面的情况
            //如果有必要也可以设置一个z-index属性
            if ($(this).children().eq(0).text() == "操作" || $(this).children().eq(0).children().attr('operate')=="edit") { //防止PPL列滚动
                $(this).children().eq(0).css({ "position": "relative", "top": "0px", "left": left, "background-color": "#F5F5F5", "z-index": "1" });
                $(this).children().eq(1).css({ "position": "relative", "top": "0px", "left": left, "background-color": "#F5F5F5", "z-index": "1" });
                $(this).children().eq(2).css({ "position": "relative", "top": "0px", "left": left, "background-color": "#F5F5F5", "z-index": "1" });
                $(this).children().eq(3).css({ "position": "relative", "top": "0px", "left": left, "background-color": "#F5F5F5", "z-index": "1" });
            }
        });
    });
}