页面的input唤醒软键盘再收起后,页面会出现软键盘高度的空白背景
微信浏览器在版本6.7.4及以上会有这个bug:页面的input唤醒软键盘再收起后,页面会出现软键盘高度的空白背景,触摸到滚动条会消失恢复!
解决代码
后台框架嵌入iframe的情景,iframe内部页面输入框唤醒软键盘,控制顶层window滚动
var wechatInfo = navigator.userAgent.match(/MicroMessenger\/([\d\.]+)/i);
if(wechatInfo){
$("input,textarea").blur(function(){
var currentPosition,timer;
var speed=1;//页面滚动距离
timer = setInterval(function(){
currentPosition = $('window.top').scrollTop();
currentPosition-=speed;
window.top.scrollTo(0,currentPosition);//页面向上滚动
currentPosition+=speed; //speed变量
window.top.scrollTo(0,currentPosition);//页面向下滚动
clearInterval(timer);
},1);
})
}
普通页面
if (browser.versions.mobile) {//判断是否是移动设备打开。browser代码在下面
var ua = navigator.userAgent.toLowerCase();//获取判断用的对象
if (ua.match(/MicroMessenger/i) == "micromessenger") {
//在微信中打开
$("input,textarea").blur(function(){
var currentPosition,timer;
var speed=1;//页面滚动距离
timer=setInterval(function(){
currentPosition=document.documentElement.scrollTop || document.body.scrollTop;
currentPosition-=speed;
window.scrollTo(0,currentPosition);//页面向上滚动
currentPosition+=speed; //speed变量
window.scrollTo(0,currentPosition);//页面向下滚动
clearInterval(timer);
},1);
})
}
}
页面的input唤醒软键盘再收起后,页面会出现软键盘高度的空白背景的更多相关文章
- 页面的div中有滚动条,js实现刷新页面后回到记录时滚动条的位置
当div中绑定数据,给它一个属性overflow-y: scroll,添加长度大小,使其能够出现滚动条:每次刷新的时候滚动条总是会出现在最上方,这使我很头疼,经过查阅网上资料,返现两种方法可行.如下: ...
- ios 最新系统bug与解决——微信公众号中弹出键盘再收起时,原虚拟键盘位点击事件无效
最近ios发布新版本系统12.1,随着部分用户的系统更新,一些问题也渐渐暴露出来... 公司用户反映微信公众号出现了点击无效的bug!!测试调查发现,只有iphonex.iphone6,ihpone7 ...
- 征信报告页面的input验证收集
https://ipcrs.pbccrc.org.cn/ function checkLoginName() { var loginName = $.trim($("#loginname&q ...
- h5页面ios键盘弹出收起后页面底部留白问题
<input placeholder="验证码" type="tel" v-model="verify" maxlength=&quo ...
- IOS微信点击input弹出输入法,关闭后页面留白解决方案
场景:IOS用微信点击input框弹出输入法后 不管你是输入信息,还是不输入直接点完成关闭输入法,都会导致页面被挤上去后产生留白,从而改变页面布局 解决方法: 给input添加 ...
- 移动端 mui框架中input输入框或任何输入框聚焦后页面自动上移
一.mui框架中点击input后,安卓手机弹出自带的输入键盘时,页面自动上移 实现方法: (1)只要把input标签放在mui-content这个类里面就可以了 <div class=" ...
- javascript笔记——点击按钮(或超链接)如何跳转到另外一个页面并执行目标页面的js函数
页面跳转同时执行js代码$(function(){});url参数传递 标题的前半部分其实不必赘述,按钮也可以换成超链接.. 假设是需要在A页面上的一个按钮,点击后跳转到B页面,传一些参数后且并B页面 ...
- UWP webview 键盘bug,回退页面,键盘会弹一下。
最新项目发现一个关于Webview的键盘bug. 具体问题:当点击Webview 网页里面input之类的东东,输入键盘会弹出来,这个时候,按回退键,键盘会收起来,再按回退键,界面会退到前一个页面,但 ...
- 微信公众号页面的web页面键盘弹起问题
今天开发的过程中,遇到了一个小问题,是这样的, UI的设计稿中有个底部的按钮是相对于屏幕定位的,但是这个页面还有一个输入框:具体情况请看下图: 这就造成了当我们输入框获取焦点的时候,键盘弹起,下面的 ...
随机推荐
- pyenv安装及常用命令
1.pyenv安装 #下载安装脚本curl https://pyenv.run | bash #添加环境变量 echo 'export PATH="/root/.pyenv/bin:$PAT ...
- KindEditor 取不到值 与清空不掉值
var editor; KindEditor.ready(function(K) { editor = K.create('textarea[name="content"]', { ...
- 安卓触控一体机的逆袭之路_追逐品质_支持APP软件安卓
显示性能参数 接口:RGB信号 分辨率:1024*600 比例16:9 显示尺寸(A.A.):222.72*(W)*125.28(H)mm 外围尺寸:235.0(W)*143.0(H)*4.5(T)m ...
- 医学图像数据(一)——TCIA基本介绍
1.介绍 The Cancer Imaging Archive (TCIA)是癌症研究的医学图像的开放获取数据库.该网站由国家癌症研究所(NCI)癌症影像计划资助,合同由阿肯色大学医学科学院管理.存档 ...
- Large-Margin Softmax Loss for Convolutional Neural Networks
paper url: https://arxiv.org/pdf/1612.02295 year:2017 Introduction 交叉熵损失与softmax一起使用可以说是CNN中最常用的监督组件 ...
- Git(2):本地版本库的一些操作
参考链接:https://www.cnblogs.com/zhuwq585/p/6390542.html
- 题解 P3246 【[HNOI2016]序列】
很久之前做过这道题,但是跑得贼慢,现在用了可以被卡成 n m 的笛卡尔树做法,发现跑得贼快[雾 noteskey 介绍一种复杂度错误然鹅在随机数据下跑得贼快的算法: 笛卡尔树 方法就是 \(O~ n\ ...
- 07binlog日志介绍
设置日志格式为row 创建数据库和表 mysql> create database chinasoft charset=utf8mb4; mysql> use chinasoft; mys ...
- JVM内存模型分析(一个程序运行的例子)
(.class字节码)类加载到内存之后,内存模型:(ps:.class文件可以通过javap 指令反编译成一个可读文件) 1.java栈,本地方法栈,程序计数器(每个线程私有) 看如下程序: 以该程序 ...
- 洛谷P5284 [十二省联考2019]字符串问题 [后缀树]
传送门 思路 设\(dp_i\)表示以\(i\)结尾的\(A\)串,能达到的最长长度. 然后发现这显然可以\(i\)往自己控制的\(k\)连边,\(k\)往能匹配的\(j\)连边,就是个最长路,只要建 ...