【报Bug】uniapp在H5下的输入框，键盘被顶起来了，失去了焦点的时候，页面自动滚动到顶部。。

分类：uni-app

input h5 bug已修复

div 固定在顶部  高度60px position: fixed; top: 0; z-index: 999;  

页面内容div   div里面有input框 ，这个input在电脑和手机上看都不会被键盘挡住的--也会把页面跳到最顶部。  

div  页面底部  固定在底部

电脑端：当点击input框，电脑端正常，失去焦点，页面滚动到最顶端。忽略了我顶部有一个60px的固定div，而且也不应该让页面滚动才对。。

手机端：点击input，键盘弹出，输入文字，失去焦点，页面滚动到最顶部。。

期望的效果是：就算要兼容键盘弹出不被挡住的问题，我觉得这个可能应该交给浏览器来做吧，而且就算要滚动，也应该滚动到原始高度位置。。。

版本号vue-cli版本：2.0.0-alpha-26920200417001，我刚刚执行了npm update之后就发现这个问题了
用ide编辑器的2.6.12.20200412-alpha测试运行了下，是没有这个问题的。期望修复。

这个尤其是在电脑端上的体验很不好，随便点击一个输入框，移开鼠标在外部点击下，页面就跳位置了。。

开发小哥是不是看了https://ask.dcloud.net.cn/article/35709这个帖子照抄的代码哦？

2020-04-17 20:22 负责人:无分享

5 个回复

DCloud_uniCloud_WYQ

已确认Bug，感谢反馈

5***@qq.com

怎么解决啊？我也遇到啦收起键盘就会滑动到顶部？

2020-04-26 10:44
小徐同志

h5 ios 存在键盘顶起固定定位的元素中的input 光标与input输入框出现错位问题滑动页面又能滑到一起

2021-04-28 10:18
小徐同志

1

2021-04-28 10:27

m***@95jw.cn (作者)

测试地址   这个登录界面上有输入框，点击进去，在再外面点击下鼠标，页面就跳动  https://demo0527.95tp.cn/

m***@95jw.cn (作者)

我看到了，是 @DCloud_UNI_WYQ 这个小哥贴了一份代码

<script lang="renderjs" module="fixInput">    
    export default {    
        mounted() {    
            let inputEle = document.querySelector('.input input')    
            inputEle.addEventListener('blur',function(){    
                document.body.scrollIntoView()    
            })    
        }    
    }    
</script>

估计是这个导致的

m***@95jw.cn (作者)

找到问题了，在cli的uni提供h5的包里面，这个会导致失去焦点后，页面滚动到顶部

node_modules/@dcloudio/uni-h5/src/core/view/mixins/keyboard.js  

    onKeyboardHide () {  
      UniViewJSBridge.unsubscribe('hideKeyboard', this.hideKeyboardTemp)  
      document.removeEventListener('click', iosHideKeyboard, false)  
      this.resetSoftinputNavBar()  
      // 修复ios端显示与点击位置错位的Bug by:wyq  
      if (document.body.scrollIntoView) {  
        document.body.scrollIntoView()  
      }  
    }

DCloud_uniCloud_WYQ

此问题已修复，2.6.16版本

不老刘

为什么2.7.9 下还有这个bug？

2020-06-04 07:41
小徐同志

还是不行吧固定定位的键盘顶起光标会错位

2021-04-28 10:11

该问题目前已经被锁定, 无法添加新回复

【报Bug】uniapp在H5下的输入框，键盘被顶起来了，失去了焦点的时候，页面自动滚动到顶部。。

5 个回复

公告

相关问题

【报Bug】uniapp在H5下的输入框，键盘被顶起来了，失去了焦点的时候，页面自动滚动到顶部。。

与内容相关的链接

5 个回复

公告

相关问题