0

2ページのJQueryMobileアプリがあります:page1page2

で、次のコードを介してpage1ユーザーをリダイレクトしています。page2

$.mobile.changePage("/home/page2/", { transition: "slide" });

Page2その中に3つのdata-role="page"要素があります。これらの各ページのフッターには次のものがあります。

<div data-role="footer" data-position="fixed"> 
    <div data-role="navbar">
        <ul>
          <li><a href="#screen1">Screen 1</a></li>
          <li><a href="#screen2">Screen 2</a></li>
          <li><a href="#" class="ui-btn-active">Screen 3</a></li>
        </ul>
    </div>
</div>

/home/page2タブに直接移動すると、正常に機能します。ただし、を介してユーザーをpage2にリダイレクトするchangePage()と、タブが機能しません。これは何が原因でしょうか?

4

1 に答える 1

0

jQuery Mobileのドキュメントから:

複数ページのドキュメント内でのリンク

Ajaxを介して読み込まれたモバイルページから複数の内部ページを含むページにリンクする場合は、リンクにrel="external"またはdata-ajax="false"を追加する必要があることに注意してください。これは、URL内のAjaxハッシュをクリアするために、ページ全体のリロードを実行するようにフレームワークに指示します。Ajaxページはハッシュ(#)を使用してAjax履歴を追跡するのに対し、複数の内部ページはハッシュを使用して内部ページを示すため、これら2つのモード間でハッシュに競合が発生するため、これは重要です。

changePage()本質的にAjaxを使用してページをロードしますが、ロードされるだけなので、これが問題の原因になります#screen1

アプリのUIとロジックで、リンクを使用してからPage1へのリダイレクトを行うことができる場合:Page2

<a href="page2.html" rel="external" data-transition="slide">Go to Page 2</a>

プログラムでリダイレクトする必要がある場合は、マルチページPage2を個別のJQMページ(page21.html、page22.html、page23.htmlなど)に分割して適切にリンクするか、ユーザーがナビゲーションバーのタブをクリックしたときにコンテンツを動的に生成することを検討してください。

于 2013-01-07T03:57:49.853 に答える