标签：https www document blank 使用 and methods scrollto 收获
前言：
并没有完美解决 ！
场景：
最近在做企业微信H5的一个项目，里面有个动态列表页，开始输入框是隐藏的，点击评论才会出现并让 input 聚焦。经过测试在安卓上面应该没什么问题，但是iOS上面会出现 input 被软键盘遮盖或者半遮盖、甚至发送按钮不能点击的状况。
总的来说问题有点小严重。
查阅百度：
好的，百度一搜，哇！解决方案很多，我就放心的去抽了一根烟，想着分分钟完事。BUT 经过试验 百度 “ios 下input 被软键盘遮盖” 前两页没有一个能解决我的问题的！！！
不过收获还是有的... 参考文章如下（写了三个比较可以的吧）
https://blog.csdn.net/github_37533433/article/details/66471962
https://juejin.im/post/5b0401b2f265da0b71569ca0
https://www.cnblogs.com/wx1993/p/6059668.html
解决（Vue）：
因为 iOS 下软键盘弹出并不会改变窗口高度所以也就没试监听 window 的 resize 事件。
第（n-2）次是在输入框获取焦点的时候：
// 输入框获得焦点 onFocus(){ var that = this; setTimeout(function(){ that.sendText.scrollIntoView(true); that.sendText.scrollIntoViewIfNeeded(); },100); },
scrollIntoView(true)：滚动浏览器窗口或容器元素，以便在当前视窗的可见范围看见当前元素。
有效果，但是还是会有问题，偶尔还是会出现半遮盖的情况 iPhone6 尤为明显。
第（n-1）次 是使用的滚动到底部的方法，因为项目的动态列表是有分页的，所以适当的改了一下。
created(){ var u = navigator.userAgent; this.isAndroid =u.indexOf("Android") > -1 || u.indexOf("Adr") > -1; //Android终端 this.isIOS =!!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //IOS终端 }, methods:{ // 输入框获得焦点 onFocus(){ var that = this; this.bfscrolltop = document.body.scrollTop; // 记录当前位置 if(this.isIOS){ setTimeout(function(){ document.body.scrollTop = document.body.scrollTop*1 + 200; },300) } }, },
在点击发送的时候设置： document.body.scrollTop = this.bfscrolltop;
问题：
1、在监听失去焦点的时候设置 document.body.scrollTop = this.bfscrolltop 是点不了发送的 （这就触及到我知识的盲区了）
2、ios 不管型号（可能除了SE）第一次点击评论还是可能会出现半遮盖，或者全遮盖的情况。
第n次 是在点击评论的时候 加了一个定时器（我不知道为什么这样写就好了！）
created(){ var u = navigator.userAgent; this.isAndroid =u.indexOf("Android") > -1 || u.indexOf("Adr") > -1; //Android终端 this.isIOS =!!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //IOS终端 }, methods:{ // 点击评论 commentClick(index){ var that = this; if(this.isIOS){ setTimeout(function(){ document.body.scrollTop = document.body.scrollTop*1 + 300; },300) } that.$refs.import_inp.focus(); }, // 输入框获得焦点 onFocus(){ var that = this; this.bfscrolltop = document.body.scrollTop; // 记录当前位置 if(this.isIOS){ setTimeout(function(){ document.body.scrollTop = document.body.scrollTop*1 + 200; },300) } }, // 输入框失去焦点 changeBlur(){ var that = this; // input 输入框 内无内容的情况下点击ios软键盘的完成是可以回去的 if(this.inputVal == ""){ document.body.scrollTop = this.bfscrolltop; } }, // 点击发送 sendComment(){ document.body.scrollTop = this.bfscrolltop; }, },
注：以上代码只是关于input输入框被遮盖的。
目前在 iPhone7 iPhone6 iPhoneSE 上没什么问题
问题：
1、当输入框内有内容的时候，关掉软键盘是不能返回记录的位置的
总结：
目前只能解决到这个地步了。黔驴技穷。
有什么好的解决方案还望看到的朋友指点一二。
根据自己的项目问题选择一个尽可能最好的方法解决
标签：https www document blank 使用 and methods scrollto 收获
原文地址：https://www.cnblogs.com/wyhlightstar/p/9406386.html
