Question

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

任何建议都表示赞赏。

Answer 1

或者，您可以使用标题标记中的以下内容来避免页眉和页脚切换。

数据抽头肘节= “假”

<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

Answer 2

解决此问题的最简单方法是使用输入焦点和模糊事件。

在jQuery中：如果您正在使用html5页脚标记或在必要时更改为类名。

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

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

Answer 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>

Phonegap JQM固定页眉和页脚在解除android键盘后移动/隐藏

3 个答案: