javascript - 滚动时如何锁定表格的第一行和第一列，可能使用 JavaScript 和 CSS？

Question

当您激活“卡住 Pane ”时，如何创建一个第一行和第一列都被锁定的表格，就像在 Excel 中一样？我需要表格水平和垂直滚动(存在很多解决方案，但只允许垂直滚动)。

因此，当您在表格中向下滚动时，第一行将保持不变，因为它会有列标题。这可能最终会出现在 thead 中，也可能不会，无论怎样使解决方案更容易。

当您向右滚动时，第一列保持不变，因为它包含行的标签。

我很确定单独使用 CSS 是不可能的，但是谁能给我指出一个 JavaScript 解决方案？它需要在所有主要浏览器中工作。

Answer 1

哦，好吧，我查找了具有固定列的可滚动表以了解此特定要求的需要，而您的问题就是其中之一，但没有明确的答案。

我回答了这个问题Large dynamically sized html table with a fixed scroll row and fixed scroll column这启发了我作为插件展示我的作品 https://github.com/meetselva/fixed-table-rows-cols

该插件主要将格式良好的 HTML 表格转换为具有固定表格标题和列的可滚动表格。

用法如下，

$('#myTable').fxdHdrCol({
    fixedCols    : 3,       /* 3 fixed columns */
    width        : "100%",  /* set the width of the container (fixed or percentage)*/
    height       : 500      /* set the height of the container */
});

您可以查看 demo and documentation here