0

折りたたみ可能なリストビューを含む Web アプリケーションを開発しています。<li>現在のページ ( ) をクリックする #biblepageと、別のページ ( #chapter) に移動する必要があります。#biblepageページには折りたたみ可能なリストビューが含まれており、ページ#chapterは対応するデータをロードする必要があります。

HTML コード:

<!-- Home Page -->
<div data-role="page" id="biblepage" data-transition="flip">
    <div data-role="header" data-position="fixed">
    </div>

    <div data-role="content">

         <div id="collapse_list"></div>
    </div>
</div>

<!-- Chapter Page -->
    <div data-role="page" id="chapter">
        <div data-role="header" data-position="fixed" data-theme="b">
                <h1></h1>
        </div>

        <div data-role="content"></div>

</div>

しかし、私がクリックしたとき<li>.#chapterページは開いていません(データをロードしていません)。

コード: http://jsfiddle.net/TzX7N/2/

前もって感謝します。

4

1 に答える 1

0

あなたのpagebeforechangeリスナーは間違っています。まず、toPage関数の最初のパラメーター (イベント自体) にはありませんが、2 番目のパラメーターと 2 番目の正規表現では、$chapter代わりに#chapter. 次のようになります。

 // Listen for pagebeforechange event
 $(document).bind("pagebeforechange", function (event, data) {
     // only handle changePage() when loading a page by URL.
     if (typeof data.toPage === "string") {
         // Handle URLs that requests chapter page
         var url = $.mobile.path.parseUrl(data.toPage),
             regex = /^#chapter/;
         if (url.hash.search(regex) !== -1) {
             showChapter(url, data.options);
             // tell changePage() we've handled this 
             //e.preventDefault();
         }
     }
 });

Ajax呼び出しが機能していないことに注意してください。

于 2013-11-20T10:50:56.033 に答える