解决移动端文本框被原生键盘弹出后挡住文本框

编号90015478

于 2017-07-04 15:35:26 发布

阅读量6k

点赞数 1

分类专栏：移动端问题解决文章标签：输入框被原生键盘遮挡移动端bug解决

本文链接：https://blog.csdn.net/qq_20353887/article/details/74331419

版权

移动端问题解决专栏收录该内容

1 篇文章

订阅专栏

记一次，解决移动端文本框弹出键盘遮挡输入框的方法:

document.activeElement.scrollIntoViewIfNeeded();

方法用来将不在浏览器窗口的可见区域内的元素滚动到浏览器窗口的可见区域。 如果该元素已经在浏览器窗口的可见区域内，则不会发生滚动。 

使用方法：

var input= document.getElementById("input");

input.scrollIntoViewIfNeeded();

等同于input.scrollIntoViewIfNeeded(true);

如果为true，则元素将在其所在滚动区的可视区域中居中对齐。
如果为false，则元素将与其所在滚动区的可视区域最近的边缘对齐。 根据可见区域最靠近元素的哪个边缘，元素的顶部将与可见区域的顶部边缘对准，或者元素的底部边缘将与可见区域的底部边缘对准。