Jquery搜索表单在phonegap中不起作用

Question

如果我只使用一个数据角色="page"，这很好，但如果我添加更多的页面，我的意思是使用多个数据角色＝"page"会停止工作。

<div id="studentpage" data-role="page">
<div data-role="header" data-theme="b">
<h1>Search inputs</h1>
<a href="../../" data-icon="home" data-iconpos="notext" data-direction="reverse"   class="ui-btn-right jqm-home">Home</a>
</div><!-- /header -->
<div data-role="content">
<form action="#" method="get">
<p>The search input is displayed like this:</p>
<div data-role="fieldcontain">
<label for="search">Search Input:</label>
<input type="search" name="password" id="search" value="" />
</div>
<p>Themed variation:</p>
<div data-role="fieldcontain">
<label for="searchA">Search Input:</label>
<input type="search" name="searchA" id="searchA" value="" data-theme="a" />
</div></form>
</div><!-- /content -->
</div><!-- /page -->

这很好，但如果我再添加一个具有页面角色的div

<div id="otherpage" data-role="page">
My second page
</div>
<div id="studentpage" data-role="page">
<div data-role="header" data-theme="b">
<h1>Search inputs</h1>
<a href="../../" data-icon="home" data-iconpos="notext" data-direction="reverse" class="ui-btn-right jqm-home">Home</a>
</div><!-- /header -->
<div data-role="content">
<form action="#" method="get">
<p>The search input is displayed like this:</p>
<div data-role="fieldcontain">
<label for="search">Search Input:</label>
<input type="search" name="password" id="search" value="" />
</div>
<p>Themed variation:</p>
<div data-role="fieldcontain">
<label for="searchA">Search Input:</label>
<input type="search" name="searchA" id="searchA" value="" data-theme="a" />
</div>
</form>
</div><!-- /content -->
</div><!-- /page -->

这看起来很奇怪，请帮忙。

Answer 1

我使用隐藏显示切换页面，所以它不起作用，所以用jquery方法$.mobile.changePage（"#studentpage"）代替了它，现在可以完美地使用