0

ページをリロード/リフレッシュして呼び出しページを実行するにはどうすればよいですか?

ロジック: ユーザーが正常にログインすると、ページは HTML5 ストレージをデータとして使用して管理者ページに移動します。

元 :sessionStorage.setItem('MyID','12345');

ログインに成功すると、文字列 12345 が管理者ページに表示されます。ただし、12345 を作成するプロセスは、ログイン フォームから派生しています。

私が使用するデータを読み取るには:sessionStorage.getItem('MyID')管理者ページで。

私が直面した問題は、jQueryモバイルがページをめくるとき、データ読み取り機能ブロックに入力する必要があるにもかかわらず、管理者ページがデータを読み取れないことでした:$(document).ready(function())

しかし、管理者ページを更新/リロードすると、データは手動で適切に読み取られます

私が使用した:

function callAdmin(){
   $.mobile.changePage("admin.html");
}

ページの更新またはページのリロードを使用して呼び出しページを実行するにはどうすればよいですか? または、データの結果を管理者ページに送信できる別の方法はありますか?

4

1 に答える 1

2

ここでの主な問題は、ドキュメントの準備です。これは一般的な jQuery Mobile の問題です。sessionStorage を読み取るためにページを更新する必要はありません。

必要なことは、適切な jQuery Mobile ページ イベントを使用することです。Document ready は、基本的な jQuery でのみ使用する必要があります。jQuery Mobile の場合、通常、ページが DOM に正常にロードされる前にトリガーされます。

これについて詳しく知りたい場合は、私の他の回答を読んでください: jQuery Mobile: document ready vs page events

jQueryで最初に学ぶことは、 $(document).ready()関数内でコードを呼び出して、DOM が読み込まれるとすぐにすべてが実行されるようにすることです。ただし、jQuery Mobileでは、Ajax を使用して、ナビゲートするときに各ページのコンテンツを DOM にロードします。このため、最初のページが読み込まれる前に$(document).ready()がトリガーされ、ページ操作を目的としたすべてのコードがページの更新後に実行されます。これは非常に微妙なバグである可能性があります。一部のシステムでは正常に動作しているように見えるかもしれませんが、他のシステムでは、不規則で繰り返すのが困難な奇妙な現象が発生する可能性があります。

従来の jQuery 構文:

$(document).ready() { 

});

この問題を解決するために (これは問題だと信じてください)、jQuery Mobile開発者はページ イベントを作成しました。簡単に言うと、ページ イベントは、ページ実行の特定の時点でトリガーされるイベントです。これらのページ イベントの 1 つはpageinitイベントで、次のように使用できます。

$(document).on('pageinit', function(){

});

さらに進んで、ドキュメント セレクターの代わりにページ ID を使用できます。id indexを持つ jQuery Mobile ページがあるとします。

<div data-role="page" id="index">
    <div data-theme="a" data-role="header">
        <h3>
            First Page
        </h3>
        <a href="#second" class="ui-btn-right">Next</a>
    </div>

    <div data-role="content">
        <a href="#" data-role="button" id="test-button">Test button</a>
    </div>

    <div data-theme="a" data-role="footer" data-position="fixed">

    </div>
</div>

インデックス ページでのみ使用できるコードを実行するには、次の構文を使用できます。

$('#index').on('pageinit') {

});
于 2013-04-23T08:53:56.167 に答える