近期在开发微信H5页面时碰到这个问题,如图,软键盘弹起后,若原输入框被遮挡,页面整体将会上移,然而当输入框失焦,软键盘收起后,页面未恢复,这也是ios的微信版本更新6.7.4之后才遇到的bug。

目前的解决办法是给输入框(或select选择框)添加失去焦点的事件,当输入框失去焦点,页面自动滚动到顶部,并且需要加定时器,否则偶尔会失效,具体代码如下:

$("input,select").blur(function(){
setTimeout(() => {
const scrollHeight = document.documentElement.scrollTop || document.body.scrollTop || 0;
window.scrollTo(0, Math.max(scrollHeight - 1, 0));
}, 100);
})

IOS微信6.7.4输入框失去焦点,软键盘关闭后,被撑起的页面无法回退到原来正常的位置的更多相关文章

  1. H5微信页面开发 IOS系统 input输入框失去焦点,软键盘关闭后,被撑起的页面无法回退到原来正常的位置,导致弹框里的按钮响应区域错位

    H5微信页面开发,软键盘弹起后,若原输入框被遮挡,页面整体将会上移,然而当输入框失焦,软键盘收起后,页面未恢复,导致弹框里的按钮响应区域错位. 解决方案:给输入框(或select选择框)添加失去焦点的 ...

  2. input输入框失去焦点,软键盘关闭后,滚动的页面无法恢复到原来位置

    H5微信页面开发,软键盘弹起后,若原输入框被遮挡,页面整体将会上移,然而当输入框失焦,软键盘收起后,页面未恢复,导致弹框里的按钮响应区域错位. 解决方案:给输入框(或select选择框)添加失去焦点的 ...

  3. 解决微信H5页面软键盘弹起后页面下方留白的问题(iOS端)

    前言:微信H5项目,ios端出现了软键盘输完隐藏后页面不会回弹,下方会有一大块留白 最近微信和ios都有版本升级,不知道是哪边升级造成的,但是经过测试,软键盘收起后,再滚动一下页面,下面的留白就会消失 ...

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

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

  5. IOS微信端软键盘收起后界面按钮失效问题

    问题描述: 1.在vue里封装了一个confirm的弹窗(即如下一个弹窗) 2.发现在IOS微信客户端中打开后,当需要在表单中输入内容的时候,很自然的点击了键盘右上角的[完成]按钮 3.啊~~~,惊人 ...

  6. web中ios移动端软键盘收起后,页面内容留白不下滑

    微信里面打开web页面,在ios软键盘收起时,页面键盘位置的内容留白,如下图 这个问题纠结了很久,然后请教了老大(威哥),看到页面老大给出的方案就是代码改变滚动条的位置. 这里就监听键盘收起的事件,来 ...

  7. android输入框显示在软键盘上边

    有时候在界面需要输入的时候,如果输入框在界面的下方,软键盘弹出的时候会遮挡输入框界面,对用户的体验不是很好. 在网上找的别人的解决方案 首先: 清单文件里面配置:android:windowSoftI ...

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

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

  9. 关于IOS 微信浏览器 点击输入框自动放大问题

    <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0& ...

随机推荐

  1. URL中#符号的作用

    转自http://blog.sina.com.cn/s/blog_6f9eb2dd0100sk97.html 一.#的涵义 #代表网页中的一个位置.其右面的字符,就是该位置的标识符.比如,       ...

  2. R语言 arules包 apriori()函数中文帮助文档(中英文对照)

    apriori(arules) apriori()所属R语言包:arules                                         Mining Associations w ...

  3. 1、linux-wget

    1.常用下载与参数 wget + 空格 + 要下载文件的url路径 例如: # wget linuxsense.org/xxxx/xxx.tar.gz">http://www.linu ...

  4. [MySQL] Data too long for column 'title' at row 1

    李刚轻量级JavaEE第六章的坑..艹李刚自己有没试过这些代码的啊,6.4这一份HqlQuery.java里需要的表,根本就跟他提供的sql脚本对不上啊..坑爹啊,而且字符编码集也有问题. 出现这个原 ...

  5. POJ 3693 Maximum repetition substring (后缀数组+RMQ)

    题意:给定一个字符串,求其中一个由循环子串构成且循环次数最多的一个子串,有多个就输出最小字典序的. 析:枚举循环串的长度ll,然后如果它出现了两次,那么它一定会覆盖s[0],s[ll],s[ll*2] ...

  6. 20169201 2016-2017-2 实验二《Java面向对象程序设计》

    实验一:程序设计中临时变量的使用 代码托管 1.删除数组中的元素5 for(int i = 4; i < arr.length - 1; i ++){ arr[i] = arr[i + 1]; ...

  7. PS2018学习笔记(30-35节)

    30-35:万能的钢笔-制图抠图必学-part(1-6) # 本节知识点: 钢笔工具 贝塞尔曲线 绘图方式 光标状态认识 路径 形状 形状工具 矢量蒙版 # 本节段落表: 钢笔工具知识 直线绘制知识 ...

  8. Lxc的cgroup技术

    你将学到什么 什么是cgroup 如何使用cgroup Cgroup简介 CGroup是Control Groups的缩写,是Linux内核提供的一种可以限制.记录.隔离进程组所使用的硬件资源的机制. ...

  9. Centos6安装SGE以及集群配置

    最近给实验室的服务器集群安装SGE,摸索了一天多,踩了好些坑,现在将其安装和配置过程记录下来,以免以后需要使用时又忘记了. 一.准备工作 1.关闭集群中所有节点的防火墙 #service iptabl ...

  10. java排序算法(持续更新)

    package exception; import java.util.Arrays; public class Sort { public static void main(String[] arg ...