H5-问题集锦

发表于 | 更新于:

1.【安卓手机】文本框获取焦点时导致fixed或absolute定位的按钮被手机键盘顶上去

如下：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
//navigator.userAgent.indexOf用来判断浏览器类型
var isAndroid = navigator.userAgent.indexOf('Android') > -1 || navigator.userAgent.indexOf('Adr') > -1;
if (isAndroid){//如果是安卓手机的浏览器
    var win_h = $(window).height();//关键代码
    $("body").height(win_h);//关键代码
    window.addEventListener('resize', function () {
        // Document 对象的activeElement 属性返回文档中当前获得焦点的元素。
        if (document.activeElement.tagName === 'INPUT' || document.activeElement.tagName === 'TEXTAREA') {
        if($('.footer').is(':visible')){
            $('.footer').hide();
        }else{
            $('.footer').show();
        }
        }
    });
}

页面中加入如上判断条件，可以防止定位元素上移

新问题：定位元素不上移了，但键盘上方同一位置会出现白色的占位区块

1
position: static;  // 将 fixed 换成 static 即可