Javascript 具有固定列的Html表

我正试图修复我表格的前3列，以便在水平滚动时始终显示它们。但垂直滚动时，它们需要移动

我制作了一个excel表格，其中包含它需要执行的操作：

我试过了

使用右滚动条的jquery的scrollTop，我移动黄色单元格的顶部值

当前的问题是，当我用数据库填充html表时，黄色单元格会显示出来，即使我的溢出是“滚动的”，因为它们是绝对的

请参见下图：

任何解决这个问题的方法。这样他们就隐藏起来了

---

或者我必须做的任何其他解决方案都将不胜感激

您可以使用datatables：

基本上，您将数据表作为其依赖项，并使用以下代码段：

$(document).ready( function () {
    var table = $('#example').DataTable( {
        "scrollY": "300px",
        "scrollX": "100%",
        "scrollCollapse": true,
        "paging": false
    } );
    new $.fn.dataTable.FixedColumns( table );
} );

---

您可以使用JQUERY滚动功能，以相反的方式移动要“冻结”的列。 您还需要设置z索引，以便列位于其他列的顶部

在css中：

.frezedCell
{
    z-index: 1000;
    position:relative;
}

在您的页面中：

$(document).ready(function () {
    $(".divTableParts").scroll(function () {
         var divTable = $(".divTableParts");
        $(".frezedCell").css("left", 0 + divTable.scrollLeft());
    });
});

---

我曾经讨论过同样的问题，结果我非常激动，我决定使用3个表：1个用于标题，1个用于固定列，1个用于可滚动列，它们都包装在具有不同属性的div上。我宁愿将其保存在一个表中，因为我将该表发送给一个函数，该函数将该表导出为excel、word、pdf。不确定您当前的HTML结构是否可以实现这一点。。你想过使用插件吗？jQuery有很多好的数据表类型插件。例如，这就是为什么我只是评论而不是回答。但是，您可以在将数据发送到函数之前编译数据。我认为没有问题。如果没有人给你答案，你会在某个时候做的。我希望情况不会是这样。还有一些插件可以实现这一点，但我必须承认，我对它们中的任何一个都不是很喜欢：jquery.fixedHeaderTable和jscrollpane。我知道。但我不得不说，我仍然在寻找答案。尝试过了，它就像谷歌chrome中的一个魅力，但IE刷新速度慢，所以它落后了，但它做了我想要它做的。已接受：）

$(document).ready(function () {
    $(".divTableParts").scroll(function () {
         var divTable = $(".divTableParts");
        $(".frezedCell").css("left", 0 + divTable.scrollLeft());
    });
});