移动端-判断是否安卓ofios 键盘抬起挡住文本框输入内容

当输入框获取光标 键盘抬起 输入框向上对齐顶部(配合vue中的refs使用,给谁设置,谁就跟顶部对齐)

 <input v-model="ownerName" type="text" maxlength="16" placeholder="请输入申请人姓名 " @focus="userFocus()" autocomplete="off" ref="userobj">

methods: {
        //申请人姓名获取焦点(防止键盘弹起遮住输入框)
        userFocus(){
               let that=this;
             setTimeout(()=>{
                    let pannel=that.$refs.userobj;
                    //让当前的元素滚动到浏览器窗口的可视区域内
                    pannel.scrollIntoView(true);
                    //此方法是标准的scrollIntoView()方法的专有变体
                    pannel.scrollIntoViewIfNeeded();
             },300)
        },
}

判断移动端是安卓of ios

        var u = navigator.userAgent;
        var isAndroid = u.indexOf("Android") > -1 || u.indexOf("Adr") > -1; //android终端
        var isiOS = !!u.match(/(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
        if (isAndroid) {
            // 安卓机
            console.log("安卓手机");
        } else if(isiOS){
            console.log("isiOS");
        }
        

两个配合可以解决安卓键盘抬起 输入框被挡住的问题(偶尔被挡住,当时这个问题是存在的,这是个卡bug)

原文地址:https://www.cnblogs.com/bigbang66/p/15102594.html