移动页面经常会做到这样一个效果,看下面的图片,重点就是那个固定定位的底部,里面有个input输入框,在输入字符的时候,安卓手机看着是完全没有问题!

1、页面没有点击底部input的初始状态

2、安卓手机下的样子,一切都是那么的正常,简直是完美。

3、ios手机下,就是这么任性,没有办法,完全挡着了,挡着了,挡着了...,必须把整个页面滑到最底下才能看见它,捉迷藏啊简直是。

不怕丢人的说,此问题遇见一年多了终于得到完美解决,更加精彩、更加狗血的是代码只有特么的一行!

请睁大眼睛看

<script type="text/javascript">
$("input").on("click", function() {
setTimeout(function(){
document.body.scrollTop = document.body.scrollHeight;
},300);
})
</script>

具体现实效果,我就不截图显示了,惊喜得自己发现、试过才知道,是不? 

IOS 固定定位底部input输入框,获取焦点时弹出的输入法键盘挡住input的更多相关文章

  1. 【土旦】vue 解决ios H5底部输入框 获取焦点时弹出虚拟键盘挡住输入框 以及监听键盘收起事件

    问题描述 im聊天H5页面,在iOS系统下,inpu获取焦点弹出系统虚拟键盘时,会出现挡住input的情况,十分影响用户体验. bug图 解决方法: html: <input type=&quo ...

  2. 点击底部input输入框,弹出的软键盘挡住input(苹果手机使用第三方输入法 )

    测试移动端页面的时候,偶然发现点击底部input输入框时,弹出的虚拟键盘偶尔会挡住input输入框. 输入框固定在页面底部,如图所示:   input固定底部设计图.png 点击底部input输入框唤 ...

  3. 小程序input输入框获取焦点时,文字会出现闪动

    最近在开发小程序时,发现一个有趣的现象.input里面设置了placeholder,随后当输入框获取焦点时,文字会出现一瞬间的抖动,随后正常. 猜想可能是设置的font-family不同引起的抖动,但 ...

  4. 移动端页面中点击input输入框的时候弹出的键盘将输入框挡住的问题

    使用的是vux框架, 以为是框架问题, 后来发现是把当前页面的高度写死为了height:200%: 只要把高度去掉就能让页面自动弹到输入框的上方:

  5. 【原创】修复ios输入框获取焦点时不支持fixed的bug

    前些日子,做了一个手机站的项目,有一个页面是这样的, 有一个固定(position:fixed)的头部和底部导航,中间是一些表单内容,没啥特别的.但是到了ios中,正常滚动页面没有问题,一旦触发了文本 ...

  6. 移动端H5页面 input 获取焦点时,虚拟键盘挡住input输入框解决方法

    在移动端h5开发的时候,发现如果input在页面底部,当触发input焦点的时候会弹出系统虚拟键盘,虚拟键盘会遮挡input输入框.这会很影响用户体验,于是在网上找到了如下的解决办法: 方法一:使用w ...

  7. 移动端H5页面_input获取焦点时,虚拟键盘挡住input输入框解决方法

    在移动端h5开发的时候,发现如果input在页面底部,当触发input焦点的时候会弹出系统虚拟键盘,虚拟键盘会遮挡input输入框.这会很影响用户体验,于是在网上找到了如下的解决办法: 方法一:使用w ...

  8. ios兼容 input输入时弹出键盘框 页面整体上移键盘框消失后在ios上页面不能回弹的问题

    前端h5混合开发手机端ios  当有input输入时,手机下方弹出键盘使页面上移,当输入完成,键盘消失后页面显示回到原位,但实际不能点击(可点击上方区域,有反应),也就是说实际是没有回弹. 解决办法: ...

  9. Android定位&地图&导航——基于百度地图,实现自定义图标绘制并点击时弹出泡泡

    一.问题描述 上一次我们使用百度地图实现基本的定位功能,接下来我们继续实现搜索和定位,并使用LocationOverlay绘制定位位置,同时展示如何使用自定义图标绘制并点击时弹出泡泡 如图所示: 二. ...

随机推荐

  1. 使用MyEclipse生成实体类和Hibernate映射文件

    1.打开MyEclipse DataBase Explorer. 如上图,点击图中2便可切换到MyEclipse DataBase Explorer,若没有该图标,则点击图中1,便可选择MyEclip ...

  2. CAS单点登录服务器搭建

    关于cas单点登录的原理及介绍这里不做说明了,直接开始: 1.war包下载 去官网(https://www.apereo.org/projects/cas/download-cas)下载cas_ser ...

  3. python求职Top10城市,来看看是否有你所在的城市

    前言 从智联招聘爬取相关信息后,我们关心的是如何对内容进行分析,获取用用的信息. 本次以上篇文章“5分钟掌握智联招聘网站爬取并保存到MongoDB数据库”中爬取的数据为基础,分析关键词为“python ...

  4. 写给Android App开发人员看的Android底层知识(5)

    (十)Service Service有两套流程,一套是启动流程,另一套是绑定流程.我们做App开发的同学都应该知道. 1)在新进程启动Service 我们先看Service启动过程,假设要启动的Ser ...

  5. GitBook 使用

    介绍 GitBook是一个基于Node.js的命令行工具,可使用 Github/Git和Markdown来制作精美的电子书,GitBook 并非关 Git的教程. 导出格式有PDF.HTML等,需要添 ...

  6. Android Apk的反编译和加密

    这几天在上海出差,忙里偷闲学习了一下Apk的反编译工具的基本使用.下面就简单介绍一下如何将我们从网上下载的Apk文件进行反编译得到我们想要获得的资源文件和源码. Android的应用程序APK文件说到 ...

  7. Unity3d: 资源释放时存储空间不足引发的思考和遇到的问题

    手机游戏第一次启动基本上都会做资源释放的操作,这个时候需要考虑存储空间是否足够,但是Unity没有自带获取设备存储空间大小的 接口,需要调用本地方法分别去android或ios获取,这样挺麻烦的.而且 ...

  8. DOUAudioStreamer 中的DOUAudioFileProvider理解笔记

    概览 DOUAudioFileProvider读取音频文件local,ipod-library,remote audiofile(通过DOUSimpleHTTPRequest封装的CFHTTPMess ...

  9. 基于java.util.logging实现轻量级日志记录库(增加根据当前类class初始化,修复线程池模型(javaEE)下的堆栈轨迹顺序与当前调用方法不一致问题)

    前言: 本章介绍自己写的基于java.util.logging的轻量级日志记录库(baseLog). 该版本的日志记录库犹如其名,baseLog,是个实现日志记录基本功能的小库,适合小型项目使用,方便 ...

  10. thphp5.0学习笔记(一)

    1.目录结构: 其中thinkphp子目录是框架核心目录 thinkphp结构: 2.入口文件 默认自带的入口文件位于public/index.php 应用目录为application,其结构: in ...