要实现这样一个提交用户输入信息的页面,在ios中,可以很完美的将视窗上移,但是每次在安卓手机底部定位的按钮总是会在键盘弹出后,重新定位在键盘上方;这里自己在写代码时,觉得这个解决方案还算可以,记录下:
<body>
<div class="page-index">
<div class="m-input">
<input class="js-input"></div>
</div>
<div class="btn"></div>
</div>
</body>
html, body{
height: 100%;
}
.page-index {
height: 100%;
.btn {
position: absolute;
left: 0;
bottom: xxxpx;
}
}
$('.js-input').on('tap focus', function(){
if(test()) {//安卓
$('body').height($(window).height());
}
})
$('.js-input').on('blur', function(){
if(test()) {//安卓
setTimeout(function() {
$('body').height(_this.bodyHeight);
});
}
})
//检测安卓或ios
function test() {
var ua = navigator.userAgent.toLowerCase();
if (/iphone/.test(ua)) {
return false;
} else if (/android/.test(ua)) {
return true;
}
}