整个页面布局如下:
期望达到的结果：给外层设置fixed，使页面在浏览器中固定，不会产生上下拖动的效果。
最后形成的结果是：输入框获取焦点输入内容后，光标错位，导致不能选中输入框重新获取焦点（获取输入框焦点的位置发生偏移）;
解决方案：改变页面的布局结构
整个页面的最外层div使用flex布局，上下栏设置固定高度，中间主体部分用flex-grow属性代替
ps: 在使用input的时候慎用fixed属性布局
免责声明！
本站转载的文章为个人学习借鉴使用，本站对版权不负任何法律责任。如果侵犯了您的隐私权益，请联系本站邮箱yoyou2525@163.com删除。
猜您在找
H5页面在微信浏览器打开 ios 键盘收起后弹出层焦点错位
ios下input获取焦点以及在软键盘的上面
uni-app 在input获取焦点（弹出软键盘后收起软键盘），页面不下滑，留下下方空白
vue H5页面在微信浏览器打开软键盘关闭导致页面空缺的问题。
微信浏览器H5页面软键盘关闭导致页面空缺的问题
js--解决iphonex上input获取焦点时，页面上移，软键盘收起时，页面没有下移问题
h5 input失去焦点软键盘把页面顶起
IOS微信端软键盘收起后界面按钮失效问题
解决微信H5页面软键盘弹起后页面下方留白的问题（iOS端）
android edittext 获取焦点并弹出软键盘