Apache Cordova(phonegap)html input 被软键盘遮挡

原创
2016/01/16 11:56
阅读数 656

由于 我们的项目在 body 上 应用了 position:fixed; 样式,造成 android 设备上,input 不会被软键盘推起。(ios 设备不会出现这个 bug)。

事实上 position:relative; 的时候是不会产生这个bug的。

基于以上条件,我们就用下面粗暴的方式进行治疗。

//当 input 获得焦点时
$("input").focus(function(){
    $("body").css("position","relative");
});
//当 input 失去焦点时
$("input").blur(function(){
    $("body").css("position","fixed");
});

如果只是 Android 这样就ok了。

但是在 ios 上运行时,屏幕会一闪。所以在 ios 上我们就不用这个方法了,反正 ios 的 input 是正常的。

//检查 浏览器
if(navigator.userAgent.indexOf("Safari") != -1){
    $("input").focus(function(){
        $("body").css("position","relative");
    });
    $("input").blur(function(){
        $("body").css("position","fixed");
    });
}


展开阅读全文
打赏
1
0 收藏
分享
加载中
更多评论
打赏
0 评论
0 收藏
1
分享
返回顶部
顶部