IOS下中,软键盘处于窗口最顶层,与原有的窗口不冲突,所以底部导航条不会被顶起,但是在android下,软键盘与窗口处于同一层,所以当软键盘弹起时,当前窗口缩小,那么窗口内容自然要被挤;

解决办法:

安卓机:通过判断当前窗口的resize来判断窗口是否变化;

//判断当前设备
var browser = {
versions: function () {
var u = navigator.userAgent, app = navigator.appVersion;
return {
trident: u.indexOf('Trident') > -1, //IE内核
isOpera: u.indexOf("Opera") > -1,
isIEbrowser: u.indexOf("compatible") > -1 && u.indexOf("MSIE") > -1 && !(u.indexOf("Opera") > -1),//判断是否IE<11浏览器
isEdge: u.indexOf("Edge") > -1,
presto: u.indexOf('Presto') > -1, //opera内核
webKit: u.indexOf('AppleWebKit') > -1, //苹果、谷歌内核
gecko: u.indexOf('Gecko') > -1 && u.indexOf('KHTML') === -1,//火狐内核
mobile: !!u.match(/AppleWebKit.*Mobile.*/), //是否为移动终端
ios: !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/), //ios终端
android: u.indexOf('Android') > -1 || u.indexOf('Adr') > -1, //android终端
iPhone: u.indexOf('iPhone') > -1, //是否为iPhone或者QQHD浏览器
iPad: u.indexOf('iPad') > -1, //是否iPad
webApp: u.indexOf('Safari') === -1, //是否web应该程序,没有头部与底部
weixin: u.indexOf('MicroMessenger') > -1, //是否微信 (2015-01-22新增)
qq: u.match(/\sQQ/i) === " qq" //是否QQ
};
}(),
language: (navigator.browserLanguage || navigator.language).toLowerCase()
}; function judgeDeviceType(){
if(browser.versions.android){
var originalHeight=document.documentElement.clientHeight ||document.body.clientHeight;
$(window).resize(function(){
var resizeHeight=document.documentElement.clientHeight || document.body.clientHeight;
if(resizeHeight<originalHeight){//软键盘弹起
$('footer').hide();
}else{
$('footer').show();
}
});
} }

IOS下,用resize方法监测不出软键盘的收起,只能用输入框获取焦点与失去焦点的方式判断;

H5软键盘弹起收回(IOS与Android)的更多相关文章

  1. h5软键盘挡住输入框问题解决(android)

    问题 移动端浏览器中的表单在部分android机型上测试,点击靠下的输入框时会遇到弹出的软键盘挡住输入框问题 ios可自身弹起(ios自身的调整偶尔也会出问题,例如第三方键盘会遮挡,原因是第三方输入法 ...

  2. h5软键盘弹起 底部按钮被顶起问题解决

    解决思路: 当键盘弹起时隐藏掉按钮,键盘隐藏时按钮显示 监测键盘是否弹起(浏览器页面是否发生变化) 代码: 1.定义一个底部按钮 <div class="returnbtn" ...

  3. H5软键盘兼容方案

    前言 最近一段时间在做 H5 聊天项目,踩过其中一大坑:输入框获取焦点,软键盘弹起,要求输入框吸附(或顶)在输入法框上.需求很明确,看似很简单,其实不然.从实验过一些机型上看,发现主要存在以下问题: ...

  4. 可能这些是你想要的H5软键盘兼容方案

    前言 最近一段时间在做 H5 聊天项目,踩过其中一大坑:输入框获取焦点,软键盘弹起,要求输入框吸附(或顶)在输入法框上.需求很明确,看似很简单,其实不然.从实验过一些机型上看,发现主要存在以下问题: ...

  5. h5 移动端 监听软键盘弹起、收起

    前面一篇博客 h5 安卓 键盘弹起界面适配 修改webview高度提到了在adnroid中如何监听软键盘的弹起与收起,是利用的窗口的高度发生变化window.onresize事件来做突破点的,但是io ...

  6. Android之监听手机软键盘弹起与关闭

    背景: 在很多App开发过程中需要在Activity中监听Android设备的软键盘弹起与关闭,但是Android似乎没有提供相关的的监听API给我们来调用,本文提供了一个可行的办法来监听软键盘的弹起 ...

  7. android全屏下的输入框未跟随软键盘弹起问题

    最近开发中遇到,全屏模式下输入框在底部不会跟随软键盘弹起.于是网上搜索了解决的方案.大致找到了两种方案. 第一种 定义好此类 public class SoftKeyBoardListener { p ...

  8. 微信中使用popup等弹窗组件时点击输入框input键盘弹起导致IOS中按钮无效处理办法

    因为在IOS微信中在弹窗中使用input使键盘弹起,使弹窗的位置上移,当键盘关闭时页面还在上面,弹窗位移量也在上面,只有下拉才能回到原位,这样弹窗也消失了.我的处理办法就是在键盘弹起和消失的时候,让页 ...

  9. 总结几个移动端H5软键盘的大坑

    1.部分机型软键盘弹起挡住原来的视图 解决方法:可以通过监听移动端软键盘弹起 Element.scrollIntoView() 方法让当前的元素滚动到浏览器窗口的可视区域内.参数如下. true,表示 ...

随机推荐

  1. html页面引用video.js播放m3u8格式视频

    //head里面的内容,我是采用cdn引用的方式,因为项目太小 <head> <meta charset="utf-8" /> <title>二 ...

  2. 认识OSI七层模型

    概述: OSI全名(Open System Interconnect),是指定的开放系统互连参考模型,为开放式互连信息系统提供了一种功能结构的框架.层次:从低到高的层级:物理层.数据链路层.网络层.传 ...

  3. 从大厂DevOps工具链部署,看现代产品的生命周期管理

    目录 1. 认识DevOps 1.1. DevOps工具链 1.2. CI 持续集成(Continuous Integration) 1.3. CD(持续交付 & 持续部署) 1.4. Agi ...

  4. Elasticsearch原理入门

    这是一篇拼接贴,我是缝合怪 项目中用到了es,使用方法是挺简单的,封装了基本api以后,把查询条件封装一下传给client执行就可,但是光使用比较肤浅,研究一下原理和本质,更利于以后开发使用 扫盲贴 ...

  5. root和sudo

    root用户是系统中唯一的超级管理员,它具有等同于操作系统的权限.一些需要root权限的应用,譬如广告阻挡,是需要root权限的.可问题在于root比windows的系统管理员的能力更大,足以把整个系 ...

  6. [问题解决]coding时修改代码键入前边后边的自动删除

    问题原因:误按下键盘上的Insert键 解决办法:再按一下即可

  7. arduino连接12864LCD方法

    arduino连接12864LCD方法,参考相关代码. https://blog.csdn.net/txwtech/article/details/95038386

  8. 【服务器】VMware Workstation Pro虚拟机搭建本地服务器CentOs7和宝塔面板(保姆式教程)

    内容繁多,请耐心跟着流程走,在过程中遇到问题请在下面留言. 前言 这几天一直在复习thinkphp5.1,学习环境是phpStudy8.1,但是遇到了文件有缓存的问题(thinkphp5.1.39,修 ...

  9. 键盘侠Linux干货| 使用SSH方式推送文件至github仓库

    前言 作为一名优秀的计算机从业人员,相信大家github应该都知道吧.(优秀的代码托管工具) 但是由于平常使用的https方式克隆的本地仓库,每次git push时都需要输入帐号密码才能将我们修改的文 ...

  10. 7000 字说清楚 HashMap,面试点都在里面了

    我是风筝,公众号「古时的风筝」,一个兼具深度与广度的程序员鼓励师,一个本打算写诗却写起了代码的田园码农! 文章会收录在 JavaNewBee 中,更有 Java 后端知识图谱,从小白到大牛要走的路都在 ...