h5底部输入框被键盘遮挡_总结几个移动端H5软键盘的大坑【实践】

转载链接：https://segmentfault.com/a/1190000022115177

1、部分机型软键盘弹起挡住原来的视图

解决方法：可以通过监听移动端软键盘弹起

Element.scrollIntoView() 方法让当前的元素滚动到浏览器窗口的可视区域内。参数如下。

• true，表示元素的顶部与当前区域的可见部分的顶部对齐
• false，表示元素的底部与当前区域的可见部分的尾部对齐

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

window.addEventListener('resize', function() {  if (document.activeElement.tagName === 'INPUT' || document.activeElement.tagName === 'TEXTAREA') {    window.setTimeout(function() {      if ('scrollIntoView' in document.ac