Question

我正在尝试在一个基于Phonegap和JQuery Mobile框架的应用程序中进行开发。

我已将页面和子页面创建为单独的HTML文件。

index.html文件的正文部分如下所示：

<div data-role="page" id="p1" **data-theme="e"**>
<div data-role="header">App Name</div>
<div data-role="content" class="fit-content"><br/>
<ul data-role="listview" data-inset="true" data-filter="true"  data-icon="star" data-iconpos="right" data-transition="slide">
<li><a href="page2.html#p2" rel="external">Link1</a></li>
<li><a href="page3.html#p3" rel="external">Link2</a></li>
</ul></div></div>

page2.html文件的正文部分如下所示：

<div data-role="subpage" id="p2" **data-theme="e"**>
<div data-role="header">Places</div>
<div data-role="content" class="fit-content"><br/>
<ul data-role="listview" data-inset="true" data-filter="true"  data-icon="star" data-iconpos="right" data-transition="slide">
<li><a href="index.html#p1" rel="external">Go Back</a></li>
</ul></div></div>

data-theme =“e”已成功应用于index.html，但未应用于page2.html。有人可以告诉我这个行为的原因吗？？

我正在使用JQuery 1.8.3和JQuery Mobile 1.2.1版本，我正在两个HTML文件中正确调用CSS和JS版本来自本地存储（ ex：/ android_asset /www/css/jquery.mobile-1.2.1.css, ex：/android_asset/www/js/jquery-1.8.3.js /）

另外，在我脑海中挥之不去的另一个问题是，我无法打电话当我保留page2.html的正文内容时，Link1的CLICK事件在与index.html相同的HTML文件中，作为SubPage;点击Link1后，我没有被重定向到Page2.html，即使我提供 href =“＃p2”，而不是href-“page2.html＃p2” 。

Answer 1

在index.html的列表分隔符中提供 data-ajax =“false”。这告诉框架执行整页重新加载以清除URL中的Ajax哈希。根据{{3}}，

“提供 data-ajax =”false“至关重要，因为Ajax页面使用的是 hash（＃）跟踪Ajax历史记录，同时使用多个内部页面用于表示内部页面的哈希，因此会发生冲突。“

此外，将data-role =“subpage”重命名为data-role =“page”。这是解决这个问题的方法。

数据主题不适用于Subpage - JQuery mobile和Phonegap

1 个答案: