2

私のjQueryモバイルアプリで;

menu.html とbody 内で、help.html に移動するために次のようなことを行います。

....

$(document).off('pageinit', '#menupage').on('pageinit', '#menupage', function() {

    $(document).off('click', '#help').on('click', '#help', function(){
            $.mobile.changePage("help.html", {
                reloadPage: true,
                transition: "flip",
                reverse: false
            });
        });
}

....

<li><a id="help" href="#" role="link" data-role="none">
                        <div class="img help"></div>
                        <div class="menuTitle langMenuItem3">Help</div>
                        <div class="arrow"></div>
</a></li>

次に、help.html ページに、menu.html に戻るための次のような戻るボタンがあります。

<header data-role="header">
    <a href="#" data-rel="back" class="button" data-role="none">
        <div class="arrow_reverse"></div><span class="langBack">Terug</span>
    </a>
    <div class="pageTitle">Over deze app</div>
</header>

私の問題は、これが通常の条件下で機能することですが、 menu.htmlを更新してから help.html に移動し、再度メニューに戻ると、menu.html が正しく読み込まれず、ページが視覚的に正常に読み込まれていることがわかります。しかし、firebugでは、タグ内の必要なjavascriptがヒットしなくなっていることがわかります.menu.htmlのどこにでもjavascriptがヒットすることはなく、キャッシュから以前のhtmlをロードするだけです. また、menu.html のページ タイトルが正しく変更されず、それ以降は「ヘルプ」のままになります。

私の完全な menu.html は次のようになります。

http://jsfiddle.net/M5CYZ/

何か案は？

4

2 に答える 2

2

これは大まかな推測ですが、コードによると、これは通常の動作です。

jQuery Moible イベント pageinit は、最初のページの読み込み中に 1 回だけトリガーされ、ページが更新されない限り (rel="external" またはあなたの場合は reloadPage="true" で手動で)、再度トリガーされることはありません。

ページにアクセスするたびに JavaScript を再度実行する場合は、代わりに pagebeforeshow イベントを使用します。あなたの例に見られるように、 pageinit を削除して再度追加しても役に立ちません。

詳細を知りたい場合は、ページ イベントに関する他の回答/記事をお読みください: jQuery Mobile: document ready vs page events

そして、ここに私の主張を証明する例があります: http://jsfiddle.net/Gajotres/Q3Usv/

$(document).on('pageinit', '#index', function(){       
    alert('Pageinit');
});

$(document).on('pagebeforeshow', '#index', function(){       
    alert('Pagebeforeshow');
});
于 2013-04-05T13:58:34.273 に答える