vue中解决安卓系统软键盘出现输入框被覆盖问题

function scrollToEnd(){
    document.body.scrollTop = document.body.scrollHeight;
  }
  var interval;
function scrollToEnd(){
    console.log(document.body.scrollTop,document.body.scrollHeight)
    document.body.scrollTop = document.body.scrollHeight;
}
  var interval;
  
  
  if (isAndroid) {
    //这个是安卓操作系统
        $('.showkeyboad').focus(function(){
    
             var target = this;
            setTimeout(function(){
                target.scrollIntoViewIfNeeded();
            },400);
            
            clearInterval(interval);
        })
        $('.showkeyboad').blur(function() {
            interval = setInterval(function() {
                scrollToEnd();
            }, 500);
        });
    }else{
         $("input,textarea").on("blur",function(){
                    setTimeout(function(){
                        window.scrollTo(0,0);
                    },100)
                }).on('focus',function(){
                    var clientHeight = document.documentElement.clientHeight ||document.body.clientHeight;
                    var offsetTop = $(this).offset().top - (clientHeight / 4);
                    setTimeout(function(){
                        window.scrollTo(0,offsetTop);
                    },100)
                })
    },
    destroyed(){//销毁
      clearInterval(interval)
    },

  进行混合式开发时经常会出现系统不兼容导致的输入框问题,记录一下

 

posted @ 2020-02-22 20:56  Fujijill  阅读(1744)  评论(0)    收藏  举报