h5中输入框被输入法遮挡/底部输入框被输入法遮挡-js（scrollIntoView）解决方法

最新推荐文章于 2024-09-30 21:15:00 发布

许亚宾

最新推荐文章于 2024-09-30 21:15:00 发布

阅读量3.5k

点赞数

文章标签： js 输入框遮挡舒服法遮挡 ios

本文链接：https://blog.csdn.net/XYB18838209380/article/details/97897258

版权

// 键盘调起需要时间延时处理，scrollIntoView是H5的api jquery没有这种方法要用原生获取元素
setTimeout(function () {
    var element = document.getElementById("chatArea");
    element.scrollIntoView(true);
//下面方法解释中 true 是在可视区域的顶部，但是在我实际使用中发现他是在可视区域的底部
},300);

element.scrollIntoView(); // 等同于element.scrollIntoView(true) 
element.scrollIntoView(alignToTop); // Boolean型参数 
element.scrollIntoView(scrollIntoViewOptions); // Object型参数

参数

alignToTop

一个Boolean值：

如果为true，元素的顶端将和其所在滚动区的可视区域的顶端对齐。相应的 scrollIntoViewOptions: {block: "start", inline: "nearest"}。这是这个参数的默认值。
如果为false，元素的底端将和其所在滚动区的可视区域的底端对齐。相应的scrollIntoViewOptions: {block: "end", inline: "nearest"}。

参考链接 https://developer.mozilla.org/zh-CN/docs/Web/API/Element/scrollIntoView