弹出框在我们日常开发中经常需要用到,而在弹出框中加入input更是常见。
今天就来讲一讲我在开发中遇到的一个问题
废话不说,直接贴代码(这里只贴主要代码)
然后再看在手机运行的效果
到这里为止,还是没有任何问题的,现在我们点击输入框,键盘被唤起,开始输入数字,问题出现了
细心的同学可能发现了,光标怎么跑到下面去了,看到这样的画面,可能就想爆粗口了(我靠 fuck shit 叼你老母嘿呀 顶你个肺呀)这是什么鬼
其实这是一个我们经常会遇到的问题,在ios中,当我们设置position为fixed的时候,键盘被唤起的时候会影响我们的布局,将弹出框往上顶,以防键盘挡住我们的弹出框,所以就出现了这样的问题
对于这个问题,我主要想了两个办法
第一个:当使用fixed布局的时候,我们将弹出框的位置距离顶部稍近一点,保证键盘被唤起的时候不会影响我们的布局
第二个:将fixed改成absolute,这样键盘唤起的时候弹出框就不会随着上移,但是有可能产生的一个问题就是键盘挡住我们的弹出框
由于技术有限,只能想到这两个办法,有更好办法的书友欢迎留言