要做一个整屏的有背景色的登陆页面，遇到的一些实现方法和踩过的坑记录一下：
1.整屏有颜色的，高度不设置100%，给html，body设置背景色；
如果设置高度100%，在部分IOS手机上，input框选中再失去焦点之后会没办法点击，焦点在键盘弹起时的位置；
如果设置固定值的高度，体验会不好，会上拉出现一节没有内容的页面，也会出现软键盘收起时出现白条。
2.底部有固定定位导航条的，软键盘弹起会置于软键盘上面，即固定定位相对于可视区域来定位的；
3.在IOS12+的V6.7.4+的微信上，会出现软键盘收起时出现空白；
下面针对这点作出的解决方法：
（1）用focus和blur来判断键盘的弹出和收起状态；
（2）由于页面中有多个input，所以需要定义几个flag字段来判断页面是否没有focus的input，然后才将页面滚动到顶部；
（3）对input遍历绑定一下focus事件，给flag赋值为true；
（4）对input遍历绑定一下blur事件，当所有的input都处于blur状态，即flag都为false的时候，页面滚动到顶部；
（5）在blur事件中判断flag值的时候，存在focus事件给flag赋值的异步问题，所以在blur判断的时候加一个延迟定时器，再进行判断。
（6）这种通过全局设置变量的，绑定事件的时候需要用$("#...").on("click",function(){})这种方法，而不能在行内通过onclick来设置，否则判断全局变量值的时候会出现undefined的情况。
（7）代码如下：
网友评论