如何使用jQuery获取可滚动HTML表格的垂直滚动条值？

你的CSS已经实现了tbody区域的垂直滚动，要在页面跳转返回后恢复滚动位置，只需通过JavaScript监听滚动状态并持久化存储，再在页面加载时读取恢复即可，具体步骤如下：

1. 监听滚动事件，保存滚动位置 #

给滚动的tbody元素添加滚动监听，每次滚动时将当前的滚动距离（scrollTop）存入本地存储（localStorage），确保刷新或跳转后数据不会丢失：

// 获取目标tbody元素
const scrollableTbody = document.querySelector('.table-scroll tbody');

// 监听滚动，保存位置到localStorage
scrollableTbody.addEventListener('scroll', () => {
  localStorage.setItem('tableScrollPos', scrollableTbody.scrollTop);
});

2. 页面加载时恢复滚动位置 #

在页面加载（包括从其他页面返回）时，读取本地存储中保存的滚动位置，设置回tbody元素：

// 页面加载完成后恢复滚动位置
window.addEventListener('load', () => {
  const savedPos = localStorage.getItem('tableScrollPos');
  if (savedPos) {
    scrollableTbody.scrollTop = parseInt(savedPos);
  }
});

注意事项 #

• 如果页面中有多个可滚动表格，需给每个表格设置唯一的localStorage键名，避免位置覆盖
• 若表格内容是动态渲染的，需在内容渲染完成后再执行恢复位置的代码
• 本地存储的数据会一直保留，若需要清空，可在适当时机调用localStorage.removeItem('tableScrollPos')

内容的提问来源于stack exchange，提问作者Bragon