jQuery mobile 修复了 iPad 中的标题问题

Posted 2023-03-15

【中文标题】jQuery mobile 修复了 iPad 中的标题问题

【英文标题】：jQuery mobile fixed header issue in iPad

【发布时间】：2013-04-15 10:06:19

【问题描述】：

我正在使用 jQueryMobile 为 ios 构建一个混合应用程序。我的页眉和页脚通过应用程序固定。所以最初我选择了data-position="fixed"。当表单元素获得焦点时，iPad 键盘会弹出并推动整个页面对齐，以便焦点字段可见。

离开场地时，iPad 键盘会向下滑动。这让我的标题跳到了页面的中心。

我徒劳的尝试：

已删除 data-position="fixed" 包括我的样式中的所有 css（位置：固定；顶部：0；）。

关于输入字段注入定位脚本的模糊

$('input').live('blur',function()setTimeout(function() $('#header').css('position','fixed');,150);

在模糊功能上插入视口<meta>标签。

推荐的修复：

iPad bottom:0px issue

https://github.com/jquery/jquery-mobile/issues/5532

邀请您提出宝贵的建议或解决方法..

【问题讨论】：

在第二次尝试中，将.css 替换为.attr('style', 'top: 0px !important;')。而不是.live 使用.on。我希望这对你有用

@Omar 也试过了。我运气不好..:(

github.com/jquery/jquery-mobile/issues/4391

【参考方案1】：

在离开输入字段时将整个页面滚动 2px 可以解决我的问题。但是它会产生一点点闪烁效果。

$('input').live('blur',function()
        setTimeout(function()
            var pos = $('body').scrollTop();
            $('body').scrollTop(pos+'2');
        ,10);
    );