苹果以往的系统是没问题的，一般情况下，点击input唤起键盘后是会自动显示到输入框的地方，然后收起键盘页面就会恢复到底部。

但是如果苹果是已经更新到最新的IOS12的话就会发生一个BUG ，就是键盘唤起后把页面顶上去，然后把键盘收回去后页面却回不来了，保持着被顶起的状态，原本键盘的地方留出一块空白。

BUG解决：

拿了5台苹果测试了同一个页面，旧版的系统的确没有发生这种情况，最终确定是IOS最新系统的问题。

解决方法就是在input失去焦点的时候（就是收起键盘时）让页面滚动到顶部。

适用：微信H5/移动端页面

document.getElementById('#input').addEventListener(

'blur',

function(){

window.scrollTo(0,0)   //页面滚动到顶部

},

false

)　　

苹果系统 IOS 12 的H5 BUG ：键盘把页面顶上去了，底下留有一块空白区域的更多相关文章

  1. 苹果系统iOS、macOS应用管理机制

    iOS.macOS系统应用管理机制 苹果系统包括:iOS.macOS.watchOS.tvOS.应用软件的生命周期为:开发.上线.安装.使用.卸载.这篇文档将从应用生命周期的各个环节介绍苹果系统对应用 ...

  2. 虚拟机安装苹果系统 VMware 12安装Mac OS X 10.10

    工具/原料 VMware Workstation Pro 12 (这个可以自己下载,并激活,你懂得) Unlocker 207 (链接:http://pan.baidu.com/s/1i43obDb ...

  3. JS判断是否是苹果系统(ios)和安卓系统(Android)客户端

    通过判断浏览器的userAgent,用正则来判断是否是ios和Android客户端.代码如下: <script type="text/javascript"> var ...

  4. 苹果系统IOS第三方管理工具——imazing 优秀

    iMazing 是一款 Windows.macOS 平台的 iPhone.iPad 管理工具,可以进行文件.音乐.视频传输,备份与还原数据,并且可以管理已安装应用,比如重新安装那些已下架的应用,是「史 ...

  5. h5 input失去焦点软键盘把页面顶起

    var broswer=localStorage.getItem('temp') //浏览器环境 var u = navigator.userAgent var isiOS = !!u.match(/ ...

  6. iOS webView与H5的交互(返回页面的处理)

    摘自:http://blog.csdn.net/qq_29284809/article/details/50548413 调用 H5页面的同名返回方法(必须保证名字一致)!!!

  7. 移动端H5页面解决软件键盘把页面顶起

    在input失去焦点的时候加上强制页面归位 window.scroll(0,0); 上代码 <input data-component="SearchInput" type= ...

  8. [其它]iOS 12.2支持电信VoLTE了，中国电信教你如何开通：只要三步

    iOS 12.2支持电信VoLTE了,中国电信教你如何开通:只要三步 link :https://baijiahao.baidu.com/s?id=1629039609897267682&wf ...

  9. 浅述不同版本ios系统有什么特点 ios 1 -ios 12

    版本记录 版本号 时间 V2.0 2019.08.20 前言 到目前为止,ios的版本已经发到了ios11的测试版,今年正式版马上就会出来,ios发布了这么多的版本,到底每个版本都有什么显著的特点?用 ...

随机推荐

  1. thinkphp 获取模板地址

    为了更方便的输出模板文件,新版封装了一个T函数用于生成模板文件名. 用法: 大理石平台检验标准 T([资源://][模块@][主题/][控制器/]操作,[视图分层]) T函数的返回值是一个完整的模板文 ...

  2. hdu6607 min25筛+杜教筛+伯努利数求k次方前缀和

    推导过程类似https://www.cnblogs.com/acjiumeng/p/9742073.html 前面部分min25筛,后面部分杜教筛,预处理min25筛需要伯努利数 //#pragma ...

  3. springboot跨域问题解决

    package com.qif.xdqdm.config; import org.springframework.context.annotation.Bean; import org.springf ...

  4. H5 小代码（实时更新）

    :before { content: ''; display: inline-block; vertical-align: middle; height: %; } ↑  自适应垂直居中 .clear ...

  5. js 过滤非法字符

    demo = 'zhang#@$san'; reg=/[`~!@#$%^&*()_+<>?:"{},.\/;'[\]]/im; if(reg.test(demo)){ t ...

  6. C#，判断数字集合是否是连续的

    /// <summary> /// 判断数字集合是否是连续的 /// </summary> /// <returns></returns> public ...

  7. 第十三篇：一点一滴学ibatis（二）映射文件

       首先给出一个常见的映射文件局部模板 <?xml version="1.0" encoding="utf-8" ?><!DOCTYPE s ...

  8. <day001>存储到Mysql、mongoDB数据库+简单的Ajax请求+os模块+进程池+MD5

    任务1:记住如何存储到Mysql.mongoDB数据库 ''' 存储到Mysql ''' import pymysql.cursors class QuotePipeline(object): def ...

  9. C# 中的三个高级参数 params

    params params 关键字可以指定采用数目可变的参数的方法参数. 可以发送参数声明中所指定类型的逗号分隔的参数列表或指定类型的参数数组. 还可以不发送参数. 在方法声明中的 params 关键 ...

  10. Echarts——更改仪表盘方向和颜色

    做小项目需要用到仪表盘,官方给出的颜色设置如下: 而我想要如下样式的: 最后,经过一番折腾算是搞成了如下样式效果: 要达到上面效果关键在于设置Echarts的如下两处js代码: 1.大小值要颠倒,因为 ...