怎么让最外层滚动条到底后,继续滚动overflow: auto;内的数据

怎么让最外层滚动条到底后,继续滚动overflow: auto;内的数据,很迷惑,试了好几个方法都不行

首选浏览器默认的就是需要触发一个区域内的滚动条必须鼠标处于该区域,你滚动外层到底再滚动不在该区域内的dom,你就要通过js手段去判断滚动条到底后再去修改你要滚动的dom的scrollTop。

需要先获取到最外层和内层元素的 DOM 元素,然后给最外层元素添加一个滚动事件监听器。在事件监听器中,可以检查最外层元素的滚动条是否滚动到底,如果是的话,就让内层元素的滚动条继续滚动一段距离。

// 获取到最外层元素和内层元素的 DOM 元素
const outerElement = document.querySelector('.outer');
const innerElement = document.querySelector('.inner');

// 给最外层元素添加滚动事件监听器
outerElement.addEventListener('scroll', () => {
  // 检查最外层元素的滚动条是否滚动到底
  if (outerElement.scrollTop + outerElement.clientHeight >= outerElement.scrollHeight) {
    // 如果滚动条滚动到底了,就让内层元素的滚动条滚动一段距离
    innerElement.scrollTop += 100;
  }
});

仅供参考,望采纳,谢谢。

能不能变成,滚动条滑动,从外层,变成里层那个,因为我这边是移动端