H5解决安卓软键盘弹出遮蔽的方法
首先先判断是否为安卓,是的话才添加事件监听,获取焦点元素判断是否为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解决安卓软键盘弹出遮蔽的方法的更多相关文章
- 解决react-native软键盘弹出挡住输入框的问题
解决react-native软键盘弹出挡住输入框的问题 写登录页面,整体界面居中之后就出现软键盘弹出挡住输入框,用户体验不好的情况.用了RN官方的KeyboardAvoidingView组件,会有多出 ...
- js防止安卓手机软键盘弹出挤压页面导致变形的方法
5防止安卓手机软键盘弹出挤压页面导致变形的方法 输入框定位在底部,手机端打开,输入框聚焦后软键盘打开为什么会瞬间自动关闭呢? 先看看问题: 1.原来是这样的: 2.在苹果手机里面是正常的: 3.到了安 ...
- H5页面 绝对定位元素被 软键盘弹出时顶起
H5页面 绝对定位元素被 软键盘弹出时顶起 在h5页面开发的过程中,我们可能会遇到下面这个问题,当页面中有输入框的时候,系统自带的软盘会把按钮挤出原来的位置.那么我们该怎么解决呢?下面列出一下的方法: ...
- Android软键盘弹出,覆盖h5页面输入框问题
之前我们在使用vue进行 h5 表单录入的过程中,遇到了Android软键盘弹出,覆盖 h5页面 输入框 问题,在此进行回顾并分享给大家: 系统:Android 条件:当输入框在可视区底部或者偏下的位 ...
- 小米note3,华为手机,软键盘弹出之后,页面上定位的元素布局会乱掉
原因:可能是因为,软键盘弹出时,改变了height,使height:100%,不能达到原来的高度. 解决办法: $(document).ready(function () { $('body').he ...
- Android软键盘弹出时布局问题
最近项目需要做一个类似聊天室的模块,基于Socket实现的,这部分稍后一段时间再做总结,功能上的相关点都实现了小例子也做出来了,最后发现一个比较腻歪的问题就是软键盘弹出时总是会把标题“挤出”屏幕,(无 ...
- ionic项目中 软键盘弹出之后的问题:
Android SDK目前提供的软键盘弹出模式接口只有两种: 一是弹出时自动回冲界面,将所有元素上顶: 一种则是不重绘界面,直接将控件元素遮住: 1. ionic 中弹出键盘遮挡住输入框(覆盖 ...
- android软键盘弹出引起的各种不适终极解决方案
android软键盘弹出引起的各种不适终极解决方案 以下描述如何解决ListView高度小于0时出现的UI问题. 创建RelativeLayout的子类TxrjRelativeLayout publi ...
- android控制软键盘弹出方式
android一把自带的软键盘弹出方式是会将布局顶上去,造成UI乱套的情况. 解决办法:方法一:在你的activity中的oncreate中setContentView之前写上这个代码getWindo ...
随机推荐
- make的工作方式
摘自<跟我一起写Makefile> GUN的make工作时的执行步骤如下: 1)读入所有的Makefile. 2)读入被include的其他Makeifle. 3)初始化文件中的变量. 4 ...
- iOS(Swift)学习笔记之SnapKit+自定义UI组件
本文为原创文章,转载请标明出处 1. 通过CocoaPods安装SnapKit platform :ios, '10.0' target '<Your Target Name>' do u ...
- 生死状:苹果VS他的供应商
据知情人士透露,苹果已经组建了代号为Titan的汽车团队,并招募了数百名员工,准备进入汽车领域,iCar大有呼之欲出之势.事实上,苹果CEO蒂姆-库克早在去年就参观了宝马位于莱比锡的核心工厂,学习如何 ...
- 点击穿透bug · Jaywii
微信点击穿透Bug 问题描述:在移动端为了去除点击延迟引入了fast-click,然而在房贷计算器的开发中遇到了这样一个bug,用户点击了select之后,微信在弹出选择器之后会瞬间因为约300ms的 ...
- 一个很粗糙的XXXX
改dnsrecon的代码改来改去都获取不到想要的结果,也不知道是不是py中的正则和PHP的有神马不一样的地方,但是用RegexBuddy测的时候是正确的,想不通啊想不通.果断不改了,自己动手PHP ...
- 手写实现vue的MVVM响应式原理
文中应用到的数据名词: MVVM ------------------ 视图-----模型----视图模型 三者与 Vue 的对应:view 对应 te ...
- 初学Qt——菜单栏QAction+ QstackedWidget堆栈窗体实现切换分页
QstackedWidget 堆栈窗体,具体不作详述,stackedWidget 主要实现效果类似与界面分页效果,主要常与QListWidget QtreeWidget QTableWidget等结合 ...
- 前端JS题
题目如下: function Foo() { getName = function () { alert (1); }; return this; } Foo.getName = function ( ...
- 【Mood】在COVID-19疫情中
看完网课(这还得从一只蝙蝠说起...),本来准备刷几道题. 还是来记录下这次事件吧. 2月1号,病毒感染人数破万. 接下来4天(今日6号)疫情走向爆发期. 每日平均新增发病人数达到了3000~4000 ...
- [红日安全]Web安全Day5 - 任意文件上传实战攻防
本文由红日安全成员: MisakiKata 编写,如有不当,还望斧正. 大家好,我们是红日安全-Web安全攻防小组.此项目是关于Web安全的系列文章分享,还包含一个HTB靶场供大家练习,我们给这个项目 ...