h5页面input在安卓手机上点击弹起软键盘不顶起页面及顶起页面

• 今天在公司的项目中，突然遇到了input框，点击及失去焦点的时候，在安卓手机和ios手机上遇到的不同的问题，经过大量的百度，找到如下方法，希望也能帮助你们解决问题！(vue的写法），如果在Java中配合vue，那么vue的聚焦事件和失去焦点的事件没有进行触发，使用监听的方法就可以了

• vue写法

<input type="email"  name="email" placeholder="Enter here" v-model="user_email"
             maxlength="20" @blur="blur" ref="input" @focus="focus">

            focus(){//获取焦点的时候进行触发
              window.addEventListener('resize', () => {        
                if (document.activeElement.tagName == 'INPUT') {                      
                    window.setTimeout(() => { document.activeElement.scrollIntoViewIfNeeded();            
                    }, 100);        
                } 
                })
            },
            blur(){//失去焦点的时候，进行触发
                var u = navigator.userAgent;
                if (u.indexOf('Android') > -1 || u.indexOf('Linux') > -1) {//安卓手机
                    this.$refs.input.scrollIntoView(false);
                }else{
                    window.scroll(0, 0);//苹果
                }
            }

• js的原声写法

<input type="email"  name="email" placeholder="Enter here" v-model="user_email"
             maxlength="20" id="email">

//获取焦点的时候
document.getElementById("email").addEventListener("focus",()=>{
        window.addEventListener('resize', () => {        
            if (document.activeElement.tagName == 'INPUT') {                      
                 window.setTimeout(() => { document.activeElement.scrollIntoViewIfNeeded();            
              }, 100);        
           } 
        })
})
//失去焦点的时候
document.getElementById("email").addEventListener("blur",()=>{
   var u = navigator.userAgent;
   if (u.indexOf('Android') > -1 || u.indexOf('Linux') > -1) {//安卓手机
        this.$refs.input.scrollIntoView(false);
    }else{
       window.scroll(0, 0);//苹果
   }
})

• 新的补充，使用vue做的h5页面在微信中打开，当input失去焦点的时候，不点击软键盘关闭，而是点击其他的地方，软键盘关闭，页面底部还是留白，没有下去,在失去焦点的事件中，将下方的代码放上就可以了

document.getElementById("email").addEventListener("blur",()=>{
   var u = navigator.userAgent;
   if (u.indexOf('Android') > -1 || u.indexOf('Linux') > -1) {//安卓手机
       setTimeout(function () {
    document.getElementsByTagName("body")[0].style.height = document.body.scrollHeight+"px";
    document.getElementsByTagName("body")[0].style.width  = document.body.scrollWidth+"px";
},100)
    }else{
       window.scroll(0, 0);//苹果
   }
})