webapp开发下input获取焦点时被弹出键盘挡住解决方法

 $('input').on('click', function () {
        var target = this;
        setTimeout(function(){
            target.scrollIntoViewIfNeeded(); // target.scrollIntoView();
        },200);
 });

scrollIntoViewIfNeeded仅在Android，Safari Mobile下支持

scrollIntoView相对各浏览器支持较好

实测总结：
1.当input在底部时，用scrollIntoView会比输入法多出一行文字的高度，scrollIntoViewIfNeeded不会
2.发现一个ios11的兼容性问题，如果页面的上下文是绝对定位，类似聊天窗口的样式，
在ios11下，如果弹出软键盘了，那此时不能有设置窗体滚动的操作（document.dody.scrollTop），如果设置了页面滚动到某一位置。滚动就会置顶。
后来发现原因，是因为绝对定位的问题，使其无法识别高度，所以可以在输入框onfocus时底部增加一个非绝对定位的元素，使其能识别出当前页面是可滚动的即可。
注：不要给body设置-weblit-overflow-scrolling: touch;会导致页面显示异常。

<div style="height:100%">
    <div style="position: relative; height: 100%;">
      这里用绝对定位布局
      ……
    </div>
    <!--这是占位, 解决iphone ios 11针对绝对定位识别问题而增加的占位，当软键盘弹出时，需要整个页面可滚动才行 -->
    <div style="height:300px;" v-if="isIOS11 && showPlaceholder">
    </div>
</div>