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

Question

我开发了一个文本编辑器 PWA，文本区域使用 position:absolute; width/height = 100% 占用整个显示 (overflow-y = scroll)。

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

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

有没有办法对 textarea 强制执行任何滚动事件？

Answer 1

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

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

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