今天遇到在微信公众号中打开网站,input 输入框和textarea输入框获取焦点后，弹出输入法键盘，将底部的导航栏”顶到“输入法键盘上面的问题，看着非常shit！

直接上代码看效果 

        var clientHeight = document.documentElement.clientHeight || document.body.clientHeight;$(window).on('resize', function (e) {var nowClientHeight = document.documentElement.clientHeight || document.body.clientHeight;if (clientHeight > nowClientHeight) {//键盘弹出的事件处理，隐藏底部导航栏$("#plugin-contact-ring2").hide();}else {//键盘收起的事件处理，显示底部导航栏$("#plugin-contact-ring2").show();}});

我之前想到的一种方案是通过焦点事件来控制导航栏的显示与隐藏，这种方案有一个弊端：针对多个input或textarea需要来回切换，这样导航栏频繁显示和隐藏，体验更差，因此放弃了这种方案！

之前在粮食公司同样遇到这种方案，当时的PM给出的解决方案是：在需要输入的页面，隐藏掉底部导航栏，这种情况更蛋疼，要知道，当时的项目至少有几十个页面，改起来贼蛋疼，现在的方案，只需要放在layout母版页中即可。