移动端调用软键盘时，上方出现自定义的view
定义一个假的input框，
<input id="footerInput" type="text" placeholder="请收入" onfocus="this.blur();">
定义一个你想显示的view并隐藏
<div class="InputView">
<form name='loginForm'>
<input id="ViewInput" name="user" type="text" placeholder="请收入">
</form>
<p>发送</p>
</div>
css:.
InputView{
position:fixed;
bottom:50px;
background:#fff;
height:74px;
width:100%;
display:none;
}
.InputView input{
border:#fff;
background:#b9b6b6;
height:30px;
border-radius:20px;
margin-top:10px;
margin-left:28px;
padding-left:10px;
width:232px;
border:none;
/* border: 2px solid #2e9aff; */
outline:none;
}
.InputView form{
display:inline-block;
}
.InputView p{
display:inline-block;
color:#9a9696;
vertical-align:middle;
}
.oc{
color:red!important;
}
点击时，执行以下逻辑
1.显示真的input
2.自动获取焦点
3.页面加载时判断一下页面高度，软键盘显示时，判断一下页面高度，高度差就是软键盘的高度，把值赋值给自定义view的定位即可
js:
$(function(){
var innerHeight =window.innerHeight;
});
// 底部发表评论部分
$('#footerInput').click(function(){
console.log(innerHeight);
$('.InputView').show();
$('#ViewInput').focus();
var innerHeightTwo =window.innerHeight;
console.log(innerHeight-innerHeight);
var loginForm=document.forms['loginForm'],
user=loginForm.elements['user'];
user.oninput=function(){
var ViewInputLen = $('#ViewInput').val();
if(ViewInputLen.length>0){
$('.InputView p').addClass('oc');
}else{
$('.InputView p').removeClass('oc');
}
}
});
4.失去焦点是隐藏view
