小米全面屏手机浏览器的input、textarea吸底被遮挡

移动端做一个吸底的输入框，首先需要注意两大类设备，安卓和ios下的浏览器。特别是在ios下，输入框聚焦时fixed定位会出现一些问题，网上也有许多相关的帖子，在此就不再赘述了。
今天要提及的是小米全面屏下的miui浏览器。
问题描述：吸底的input聚焦后，弹出的软键盘将吸底的元素完全或者部分遮挡。
问题原因：当input聚焦后，浏览器弹出软键盘，然后将元素移动到软键盘上方，但全面屏下，miui浏览器少计算了浏览器自带的底部bar的高度。然后导致元素被软键盘遮挡高度为bar的高度。
解决方案：
1.获取window.navigator.userAgent这一字段。
2.判断是否含有"MiuiBrowser"这一字段。
3.判断屏幕的宽高比，当高度大于宽度的2倍时确定为全面屏。
4.记录一开始进入页面时的高度：window.innerHeight。
5.当输入框聚焦后，给输入框加上等于浏览器底部物理bar高度的margin-bottom。然后可以看到正常的输入框了，而且不会被软键盘遮挡。
6.软键盘的高度变化会触发浏览器的resize事件。第一次触发底部输入框聚焦时，记录变化后的window.innerHeight。
7.由于软键盘有收回这种状态，此时软键盘依然存在，但是高度缩小，同样会触发resize，此时可以用window.innerHeight与4中记录的做比较，如果是小于等于4中的高度，而且大于5中记录的高度，那么可以将输入框的margin-bottom的增加值去掉，并且将输入框blur。然后就不会露出很高的底部了。
以上。
建议：在移动端最好不要做吸底的输入框，各个浏览器的实现差距很大。