ios上fixed底部输入框被键盘遮挡的简单解决办法

最新推荐文章于 2025-10-28 16:13:38 发布

转载最新推荐文章于 2025-10-28 16:13:38 发布 · 1.3k 阅读

3 ·

CC 4.0 BY-SA版权

原文链接：https://codeleading.com/article/86743161474/

文章标签：

#javascript

文章讨论了在iOS设备上，使用position:fixed;时遇到的问题，当输入框在页面底部，弹出软键盘会遮挡输入框。为解决此问题，文中提供了一个JavaScript解决方案，即在textarea获取焦点时，延迟滚动到页面底部。

ios据说不支持position: fixed;

在安卓上面，点击页面底部的输入框，软键盘弹出，页面移动上移。

而ios上面，点击页面底部输入框，软键盘弹出，输入框看不到了。。。

var u = navigator.userAgent, app = navigator.appVersion;
var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
if (isiOS) {
    $('textarea').focus(function () {
        window.setTimeout('scrollBottom()', 500);
    });
}
function scrollBottom() {
    window.scrollTo(0, $('body').height());
}