jquery - 单击 HTML5 输入类型编号时 iPhone 标题位置发生变化

Question

我正在使用 jQuery Mobile 和 PhoneGap。目前我正面临 iPhone 版本的问题。当我单击输入类型编号时，其标题位置会发生变化。

注意: 在我的页面中，当我聚焦输入类型数字时，数字键盘将打开。

----

然后，当我触摸文本框外部时，数字键盘将关闭，标题位置会自动变回

----

这是我的代码

$("input,select").live("blur",function() {
  setTimeout(function(){
    $("[data-role=header]").css("position","fixed");
  },800);
  $("[data-role=footer]").show();
});
$("input,select").live("focus",function() {
  $("[data-role=header]").css("position","absolute");
  $("[data-role=footer]").hide();
});

Answer 1

使用此代码。它对我有用...

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