<script>let iosUser = window.navigator.userAgent.indexOf('iPhone')let inp = document.querySelector('#inp');//input输入框if (iosUser != -1) { var bfscrolltop = document.body.scrollTop;//获取软键盘唤起前浏览器滚动部分的高度 inp.focus(function () {//在这里‘input.inputframe’是我的底部输入栏的输入框，当它获取焦点时触发事件 interval = setInterval(function () {//设置一个计时器，时间设置与软键盘弹出所需时间相近 document.body.scrollTop = document.body.scrollHeight;//获取焦点后将浏览器内所有内容高度赋给浏览器滚动部分高度 }, 100) }).blur(function () {//设定输入框失去焦点时的事件 clearInterval(interval);//清除计时器 document.body.scrollTop = bfscrolltop;//将软键盘唤起前的浏览器滚动部分高度重新赋给改变后的高度 });} else { inp.onclick = function (ev) { document.querySelector('body').style.height = '999px'; inp.style.position = 'static'; setTimeout(function () { document.body.scrollTop = document.documentElement.scrollTop = inp.getBoundingClientRect().top + pageYOffset - 300; }, 50); window.addEventListener('touchmove', fn, false); } inp.onblur = function () { document.querySelector('body').style.height = "auto" document.querySelector('body').removeAttribute('style') window.removeEventListener('touchmove', fn, false) } //触摸取消blur function fn(ev) { var _target = ev.target || ev.srcElement; if (_target.nodeName != 'INPUT') { inp.blur(); } ev.preventDefault() }}</script>文章来源: 安卓和ios键盘挡住输入内容