移动端 键盘收起后页面样式不复原问题

键盘收起时的正确样式 （提交按钮处于最底部）

WechatIMG4.jpeg

弹起键盘时的样式


WechatIMG3.jpeg

键盘收起时的样式 （元素位置 ,未能复原 提交按钮处于页面中部）

WechatIMG2.jpeg

该问题出现的页面样式特征
1 如果底部有position:'fixed'样式属性的元素
2 在input 、textarea元素,获取焦点或者失去焦点时 页面式样会出现上述问题

// 处理方式 在触发input或者textarea元素的失焦事件时，执行下述代码即可
    window.scrollTo(0,0)
最后编辑于 ：
©著作权归作者所有,转载或内容合作请联系作者
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。

推荐阅读更多精彩内容

  • 史上最详细H5软键盘兼容方案
    本文转载自wuwhs的segmentfault专栏 最近一段时间在做 H5 聊天项目，踩过其中一大坑：输入框获取焦...
    兔子不打地鼠打代码阅读 10,459评论 1赞 12
  • H5软键盘兼容方案
    可能这些是你想要的H5软键盘兼容方案 前言 输入框获取焦点，软键盘弹起，要求输入框吸附（或顶）在输入法框上。需求很...
    记住了_叶阅读 790评论 0赞 2
  • 键盘兼容方案
    转载 1. 问题描述： 最近一段时间在做 H5 项目，踩过其中一大坑：输入框获取焦点，软键盘弹起，要求输入框吸附（...
    星空里的尘埃阅读 684评论 0赞 2
  • 面试题
    前端开发面试题 面试题目： 根据你的等级和职位的变化，入门级到专家级，广度和深度都会有所增加。 题目类型： 理论知...
    怡宝丶阅读 2,611评论 0赞 7
  • 移动端开发
    # 移动端开发 ### 1. 1px问题如何解决 #### ①伪类 + transform（比较完美） > 原理是...
    sunnyRube阅读 908评论 0赞 0