html - jQuery Mobile Phonegap iOS : Header flickers when I pull up keyboard

Question

标题几乎概括了它。我有一个固定的持久 header :

<div data-role="header"  data-id="headerbar" data-position="fixed" data-theme="b">

            <h1>Title!</h1>  
            <a href="#" class="ui-btn-right">Login</a> 
        </div> 

然后另一个标题通过:

<div data-role="header"  data-theme="c">
        <h6>1. Type a name </h6> 
        <input type="search" name="name" id="basic" value=""></input>
    </div> 

当我在 xcode 模拟器(以及我的实际 iphone 上)中单击文本输入时，第一个标题变为纯白色，然后弹回正确的标题。

想法？

我的屏幕是这样的:

Answer 1

您可以使用 <label>而不是 <header>

<label for="search-basic">Select Name:</label>
<input type="search" name="search" id="searc-basic" value="" data-mini="true" />

http://jsfiddle.net/6Vu4r/3/

编辑: 它是 data-position="fixed" 的属性jQuery Mobile 的属性。它的作用是当滚动屏幕时它会消失工具栏。如果你点击屏幕它就会消失，如果你再次点击它会显示工具栏。所以这就是为什么如果您再次单击第一次时标题会消失，当您再次单击时它会弹出。如果不使用，请删除该属性。希望对您有所帮助。