Phonegap JQM 固定页眉和页脚在关闭 android 键盘后移动/隐藏答案

【问题标题】：Phonegap JQM fixed header and footer moves/ hides after dismissing android KeyboardPhonegap JQM 固定页眉和页脚在关闭 android 键盘后移动/隐藏
【发布时间】：2013-07-30 02:17:46
【问题描述】：

我创建了一个使用 4 可折叠的页面。问题是当我在模拟器或移动设备中运行应用程序并在关闭键盘后在文本字段中输入一些内容时，有时页眉和页脚隐藏，有时它与页面一起滑动，然后在页面上再次出现。我正在使用 jQM1.3.1.js 文件。谁能告诉我是什么问题，我该如何解决。

欢迎提出任何建议。

【问题讨论】：

标签： android jquery-mobile header footer cordova-2.0.0

【解决方案1】：

或者，您可以使用页眉标签中的以下内容来避免在点击时切换页眉和页脚。

data-tap-toggle="false"

<div data-role="header" data-position="fixed" data-tap-toggle="false" data-theme="o">

另外，如果您的页眉或页脚在页面顶部以外的某个地方跳转。试试这个：

这已被报告为 jQM 错误，但仍未修复。我正在使用 jQM 1.3.2，它仍然存在，当您向下滚动页面底部并单击文本字段或输入时，键盘出现并且一切正常，一旦元素失去焦点，标题会跳转并固定本身不在页面顶部。

试试这个对我有用的解决方案，取自下面提到的线程。

// Workaround for buggy header/footer fixed position when virtual keyboard is on/off
$('input, textarea')
.on('focus', function (e) {
    $('header, footer').css('position', 'absolute');
})
.on('blur', function (e) {
    $('header, footer').css('position', 'fixed');
    //force page redraw to fix incorrectly positioned fixed elements
    setTimeout( function() {
        window.scrollTo( $.mobile.window.scrollLeft(), $.mobile.window.scrollTop() );
    }, 20 );
});

此处发布了其他解决方案。这是一个值得一看的线程： https://github.com/jquery/jquery-mobile/issues/5532

【讨论】：

对不起，你把这段代码粘贴到哪里了？谢谢！

【解决方案2】：

解决这个 android 讨厌的最简单方法是使用输入焦点和模糊事件。

在 jQuery 中：如果您使用的是 html5 页脚标签，或者在必要时更改为类名。

$("input").focus(function(){
    $('footer').hide();
});

$("input").blur(function(){
    $('footer').show();
});

【讨论】：

【解决方案3】：

Use these settings after jQuery js file and before jQuery mobile js file:
<script>     
$(document).on("mobileinit", function () {

  $.mobile.fixedtoolbar.prototype.options.tapToggle = false;
  $.mobile.fixedtoolbar.prototype.options.hideDuringFocus ="";

});
</script>

【讨论】：

当我在 jquery.js 文件之后和 JQM.js 文件之前写
希望您将其设置为 mobileinit 事件。