//解决微信浏览器web页面键盘收起页面不回弹
//方案一
function isWeiXinAndIos() {
let ua = '' + window.navigator.userAgent.toLowerCase()
let isWeixin = /MicroMessenger/i.test(ua)
let isIos = /\(i[^;]+;( U;)? CPU.+Mac OS X/i.test(ua)
return isWeixin && isIos
}
let myFunction
let isWXAndIos = isWeiXinAndIos()
if (isWXAndIos) {
document.body.addEventListener('focusin', () => {
//键盘弹起 (获取焦点)
clearTimeout(myFunction)
})
document.body.addEventListener('focusout', () => {
//失去焦点 键盘收起
clearTimeout(myFunction)
myFunction = setTimeout(function() {
window.scrollTo({top: 0, left: 0, behavior: 'smooth'})
}, 200)
})
}
//方案二 (普通页面)
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); })
}
}
后台框架嵌入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); })
}