2 个回答

应该算是移动端比较经典的兼容性bug了,如果没猜错的话,你的输入框应该是使用的fixed定位。
出现原因
软键盘唤起后,页面的fixed元素将失效(即无法浮动,也可以理解为变成了absolute定位),所以当页面超过一屏且滚动时,失效的fixed元素就会跟随滚动了。这便是iOS上fixed元素和输入框的bug。其中不仅限于type=text的输入框,凡是软键盘(比如时间日期选择、select选择等等)被唤起,都会遇到同样地问题。
解决思路&方案
1.既然在iOS下由于软键盘唤出后,页面fixed元素会失效,导致跟随页面一起滚动,那么假如——页面不会过长出现滚动,那么即便fixed元素失效,也无法跟随页面滚动,也就不会出现上面的问题了。
2.不嫌重的话可以使用iScroll.js
这儿有一篇比较详细的解决方案Web移动端Fixed布局的解决方案

我之前也遇到过,我觉得可以写个js这样处理,当你的input是焦点事件的时候,改变footer的fixed为absolute;失去焦点是变回fixed。你可以去试试

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题