强制页面滚动到移动设备上的 textarea

Question

我开发了一个文本编辑器 PWA，它的 textarea 使用overflow-y = scroll占用整个显示器（ position:absolute; width/height = 100% ）。

通常——大约 10 次中有 9 次——当我的手指上下滑动时，滚动发生在文本区域内，这是预期的结果。

然而，在极少数情况下，滚动应用到页面本身——而不是文本区域。 导致顶部和底部立即出现橡皮筋弹跳，而无需滚动文本区域内的实际内容。

有没有办法对文本区域强制执行任何滚动事件？

Answer 1

这可能是由于抓取了页面元素（或位于 textarea 滚动的“开始/结束”）而不是 textarea 本身。

一个解决方案可能是修复“html”和“body”标签并将它们的宽度和高度设置为 100%，同时为position: fixed ，使这些元素没有滚动空间。

html,
body {
  position: fixed;
  width: 100%;
  height: 100%;
}