在ios上比较易出现,h5页面input失去焦点后,系统键盘主动消失,但外面的容器没有复位。
用户的 scroll 和 resize 行为(即是滑动页面和改变窗口大小)会导致页面不断的重新渲染
解决方法, 让它滚动一下。
document.body.removeEventListener('focusout', ()=>{
const scrollTop = document.scrollingElement.scrollTop;
document.scrollingElement.scrollTo(0, scrollTop)
});
也有这种方式
$('input').on('blur', function () {
setTimeout(function(){
var scrollHeight = document.documentElement.scrollTop || document.body.scrollTop || 0;
window.scrollTo(0, Math.max(scrollHeight - 1, 0));
}, 100);
});
1 、当元素即将失去焦点时,focusout 事件被触发。focusout 事件和 blur 事件之间的主要区别在于后者不会冒泡。
2、focusout()不仅可以检测出当前元素的失去焦点事件,其下的子元素失去焦点时同样可以检测出来。而blur()则检测不出子元素的失去焦点事件。