虚拟键盘挡住输入框解决方案-scrollIntoViewIfNeeded

大家在做移动开发时，大概都会遇到当输入框在最底部的时候，弹起的虚拟键盘会把输入框挡住。

API：Element.scrollIntoViewIfNeeded(opt_center)，故名思意，就是在需要的时候将元素滚动到可视区域。

Element.scrollIntoViewIfNeeded() 方法用来将不在浏览器窗口的可见区域内的元素滚动到浏览器窗口的可见区域。 如果该元素已经在浏览器窗口的可见区域内，则不会发生滚动。 此方法是标准的Element.scrollIntoView()方法的专有变体。

对于前端 API 来说，我们最关心的是它的浏览器兼容性：

element-scrollIntoViewIfNeeded-can-i-use.png

语法实例

element.scrollIntoViewIfNeeded(); // 等同于element.scrollIntoViewIfNeeded(true) 
element.scrollIntoViewIfNeeded(true); 
element.scrollIntoViewIfNeeded(false);

参数

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

关于API详细介绍