问题描述:苹果系统,软键盘弹出,键盘再收起时,原虚拟键盘位点击事件无效。
排查过程:只有iphonex、iphone6,ihpone7等部分机型会出现该问题;
原因:在IOS下,点击页面中的input时,弹出软键盘时,如果input比较靠下,整个页面会上移,document.body.scrollOffset会由0变成大于0。 软键盘消失后,页面会下移。但是document.body.scrollOffset并不会变成0,所以这时候触控不准;
解决办法:失去焦点
$('textarea,input').on('blur', function (event) { document.body.scrollTop = 0; });
或者
$("input").blur(function() { console.log("失去焦点"); window.scrollTo(0, 0); });
==========================新的处理办法========================
//ios 软键盘处理,页面错位恢复问题 var isReset = true; var u = navigator.userAgent; var isiOS = !!u.match(/(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端 function scrollTO() { //软键盘收起的事件处理 isReset = true; setTimeout(function () { //当焦点在弹出层的输入框之间切换时先不归位 if (isReset) { window.scrollTo(0, 0);//失焦后强制让页面归位 } }, 300); } if (isiOS) {//ios document.body.addEventListener('focusin', function () { //软键盘弹出的事件处理 isReset = false; }); document.body.addEventListener('focusout', scrollTO); } document.body.removeEventListener('focusout', scrollTO);