自动滚动到焦点输入视图

Posted 2023-02-22

【中文标题】自动滚动到焦点输入视图

【英文标题】：Automatic scrolled into view of focus input

【发布时间】：2017-05-12 01:24:09

【问题描述】：

如何在键盘打开时启用自动滚动以聚焦输入？ 我创建了一个simple demo，其中有 2 个输入：

<div style="height:300px;"></div>
<form action="/">
   <input type="text" />
   <br/>
   <input type="text" /> 
   <button>ok</button>
</form>
<div style="height:300px;"></div>

当我点击页面底部的输入时，键盘打开并隐藏输入。

当我点击页面浏览器底部的输入时，我从手机上打开 w3s 站点蚂蚁，然后将其自动滚动到视图中。

我需要做什么才能中才能开始在我的演示中工作？

【问题讨论】：

您应该会发现这很有帮助 (***.com/a/1586366/3011082)。告诉我会发生什么:)

我知道这种方式，但我认为这是现在的默认浏览器功能，因为它在任何网站上都能正常工作，但在我的网站上却不行:)

【参考方案1】：

我解决了这个问题。在我的情况下，这是因为身体高度小于内容高度。在 codepen 上，我认为这是因为它通过 iframe 呈现。