测试发现,只有ios的微信浏览器有此问题
方法一:监测focusin/focusout
(function () {
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)
})
}
})()
方法二: 使用setTimeOut
$('input,textarea').blur(function () {
setTimeout(function(){
window.scrollTo(0,document.documentElement.clientHeight);
},100)
});
给输入框(或select选择框)添加失去焦点的事件,当输入框失去焦点,页面自动滚动到顶部,并且需要加定时器,否则偶尔会失效。
$("input").blur(function () {
setTimeout(function() {
var scrollHeight = document.documentElement.scrollTop || document.body.scrollTop || 0;
window.scrollTo(0, Math.max(scrollHeight - 1, 0));
}, 100);
});