移动端弹出软键盘时会将页面顶上去

之前做移动端项目时有出现过这样的情况，主要原因是因为当软键盘弹出，因为软键盘与页面处于相同层级，软键盘的出现会破坏原本的样式，造成部分页面不可见问题
还有一个细节问题，之前因为会出现浏览器保存的信息（类似于模糊查找），弹出后如果不选择弹出的选项的话，直接关闭软键盘，弹出的位置不会改变，影响效果
需要在input框阻止自动填充

注：当时我设置最外层父元素为相对定位，不可将之设置为固定定位，否则下面样式不会生效

<input type="text"  autocomplete="off"/>

软键盘出现前页面高度
var winHeight = window.outerHeight;
    window.onresize = function(){
    软键盘出现时页面的高度
        var changeHeight = window.outerHeight;
        if(winHeight-changeHeight>40){
            document.body.style.height=winHeight+"px";
        }else{
            document.body.style.height='100%';
        }
 	 }