首先先判断是否为安卓,是的话才添加事件监听,获取焦点元素判断是否为input或者textarea类型,是的话,Element.scrollIntoView() 方法会让当前的元素滚动到浏览器窗口的可视区域内

  created () {
var u = navigator.userAgent
if (u.indexOf('Android') > -1 || u.indexOf('Adr') > -1) {
this.onFoucs()
}
},
methods: {
onFoucs () {
window.addEventListener('resize', function () {
alert('android')
if (document.activeElement.tagName === 'INPUT' || document.activeElement.tagName === 'TEXTAREA') {
alert(document.activeElement.tagName)
// alert('2332323')
window.setTimeout(function () {
alert('scroll')
document.activeElement.scrollIntoView()
}, 1)
}
})
}
},

H5解决安卓软键盘弹出遮蔽的方法的更多相关文章

  1. 解决react-native软键盘弹出挡住输入框的问题

    解决react-native软键盘弹出挡住输入框的问题 写登录页面,整体界面居中之后就出现软键盘弹出挡住输入框,用户体验不好的情况.用了RN官方的KeyboardAvoidingView组件,会有多出 ...

  2. js防止安卓手机软键盘弹出挤压页面导致变形的方法

    5防止安卓手机软键盘弹出挤压页面导致变形的方法 输入框定位在底部,手机端打开,输入框聚焦后软键盘打开为什么会瞬间自动关闭呢? 先看看问题: 1.原来是这样的: 2.在苹果手机里面是正常的: 3.到了安 ...

  3. H5页面 绝对定位元素被 软键盘弹出时顶起

    H5页面 绝对定位元素被 软键盘弹出时顶起 在h5页面开发的过程中,我们可能会遇到下面这个问题,当页面中有输入框的时候,系统自带的软盘会把按钮挤出原来的位置.那么我们该怎么解决呢?下面列出一下的方法: ...

  4. Android软键盘弹出,覆盖h5页面输入框问题

    之前我们在使用vue进行 h5 表单录入的过程中,遇到了Android软键盘弹出,覆盖 h5页面 输入框 问题,在此进行回顾并分享给大家: 系统:Android 条件:当输入框在可视区底部或者偏下的位 ...

  5. 小米note3,华为手机,软键盘弹出之后,页面上定位的元素布局会乱掉

    原因:可能是因为,软键盘弹出时,改变了height,使height:100%,不能达到原来的高度. 解决办法: $(document).ready(function () { $('body').he ...

  6. Android软键盘弹出时布局问题

    最近项目需要做一个类似聊天室的模块,基于Socket实现的,这部分稍后一段时间再做总结,功能上的相关点都实现了小例子也做出来了,最后发现一个比较腻歪的问题就是软键盘弹出时总是会把标题“挤出”屏幕,(无 ...

  7. ionic项目中 软键盘弹出之后的问题:

    Android SDK目前提供的软键盘弹出模式接口只有两种: 一是弹出时自动回冲界面,将所有元素上顶: 一种则是不重绘界面,直接将控件元素遮住:     1. ionic 中弹出键盘遮挡住输入框(覆盖 ...

  8. android软键盘弹出引起的各种不适终极解决方案

    android软键盘弹出引起的各种不适终极解决方案 以下描述如何解决ListView高度小于0时出现的UI问题. 创建RelativeLayout的子类TxrjRelativeLayout publi ...

  9. android控制软键盘弹出方式

    android一把自带的软键盘弹出方式是会将布局顶上去,造成UI乱套的情况. 解决办法:方法一:在你的activity中的oncreate中setContentView之前写上这个代码getWindo ...

随机推荐

  1. CF-1111C-Creative Snap

    前两天过年,所以两天前的比赛题目现在才来回顾. 这题是一个最平常的递归,加一个剪枝.题目说如果一段距离没有复仇者看守,消耗的能量为A,A一定是正整数.由此可知对于没有复仇者看守的段,不拆一定比拆成两半 ...

  2. mailx发邮件报错Error initializing NSS: Unknown error -8015. . . . message not sent.处理

    前提:在配置zabbix3.0监控发送邮件告警时zabbix界面显示邮件以送达,但是QQ邮箱却没有收到邮件,再shell命令行测试发邮件QQ邮箱又是可以收到的,在别人的提醒下用zabbix用户执行发送 ...

  3. 变身六次失去核心的小米Note还能火吗

    奥特曼变身有时间限制,因此我们总是希望它多变几次身,从而把小怪兽打得嗷嗷叫.但对于科技产品来说,不断推出"变身版",似乎总有江河日下.大势已去之感.三星形形色色的复仇者联盟S6版, ...

  4. HAProxy此例简单介绍基于docker的HAProxy反代

    HAProxy拓展连接 此例简单介绍基于Docker的HAProxy反代 反代: 1.获取haproxy镜像  docker pull haproxy 2.写配置文件haproxy.cfg 1 glo ...

  5. 4K手机能拯救索尼手机吗?

    智能手机屏幕分辨率究竟达到多少才是极限,一直是业内争论不休的问题.从低分辨率一路走来,直到iPhone 4搭载视网膜屏,业内才有了一个较为统一的认知:屏幕起码要在合适距离下看不到文字.图像虚影,才称得 ...

  6. 学习日记:Python爬虫-1

    这几天在b站看小甲鱼的python3教程,照着写了个有道翻译的程序 代码中字典data中的内容,用浏览器审查元素,先随便输一个要翻译的,找到跳出来的post的那个网址,看formdata就行了 返回的 ...

  7. 一条SQL在内存结构与后台进程工作机制

    oracle服务器由数据库以及实例组成,数据库由数据文件,控制文件等物理文件组成,实例是由内存结构+后台进程组成,实例又可以看做连接数据库的方式,在我看来就好比一家公司,实例就是一个决策的办公室,大大 ...

  8. brup安装证书抓取https

    brup安装证书抓取https 0x00下载 下载安装brup 前提是需要java环境 0X01配置brup 配置brup的代理设置 0X02设置浏览器 我使用的是火狐,以下都以火狐为例 0X03证书 ...

  9. c#版阿里云oss上传——基于layui、pupload的oss 后端web端直传的vue组件

    废话前言 去年,做项目用到oss上传,度娘上逛了一圈写了个前后端代码结合的c#版oss上传. 今年又要用到oss上传时发现很难复用,复用改动的范围太大,显然这个轮子不合格.于是想了下,花了一天的时间( ...

  10. Java后端完整学习路线及资源记录

    Java后端完整学习路线及资源记录 Java语法基础 书籍教程: 视频教程: IDEA的使用 视频教程:JAVA开发利器-IntelliJ IDEA使用教程 Servlet和Web基础 书籍教程: 视 ...