22

jQuery Mobile を使用した PhoneGap アプリがあります。特定のページで、ユーザーが最後にアクセスしたページに戻ることができません。

ページ順はこんな感じです。

(1)index -> (2)listing items -> (3)form submited -> (4)sucess page

必要なもの:ユーザーが最後にアクセスしたときにすべての履歴をクリアし、ユーザーが戻ろうとした場合にのみアクセスしたようにpage 4設定します。page 1たぶんそれは完全に可能ではないかもしれませんが、私はどんな提案も受け入れます.

jQuery Mobile はナビゲーション履歴をある種の配列に保存していると思います。誰かがそれを見つけてくれることを願っています。前もって感謝します！

編集:特定の div が jQuery Mobile によって管理されるページとして機能する単一の html ページであるmulti-page template を使用しています。

4

4 に答える 4

33

基本的に、改ざんする必要がある 2 つの履歴「ポット」があります。ブラウザと JQM。

JQM urlHistory
JQM urlHistory は非常に簡単に変更できます。JQM コードから:

urlHistory = {
    // Array of pages that are visited during a single page load.
    // Each has a url and optional transition, title, and pageUrl
    // (which represents the file path, in cases where URL is obscured, such as dialogs)
    stack: [],
    // maintain an index number for the active page in the stack
    activeIndex: 0,
    // get active
    getActive: function () {
        return urlHistory.stack[urlHistory.activeIndex];
    },
    getPrev: function () {
        return urlHistory.stack[urlHistory.activeIndex - 1];
    },
    getNext: function () {
        return urlHistory.stack[urlHistory.activeIndex + 1];
    },
    // addNew is used whenever a new page is added
    addNew: function (url, transition, title, pageUrl, role) {
        // if there's forward history, wipe it
        if (urlHistory.getNext()) {
            urlHistory.clearForward();
        }
        urlHistory.stack.push({
            url: url,
            transition: transition,
            title: title,
            pageUrl: pageUrl,
            role: role
        });
        urlHistory.activeIndex = urlHistory.stack.length - 1;
    },
    //wipe urls ahead of active index
    clearForward: function () {
        urlHistory.stack = urlHistory.stack.slice(0, urlHistory.activeIndex + 1);
    }
};

したがって、上記の関数はすべて利用可能で、たとえば次のように呼び出すことができます。

$.mobile.urlHistory.clearForward();

履歴を監視するには、これをどこかに置き、(遷移が完了したら) pageChange をリッスンして、urlHistory の内容を確認します。

$(document).on('pagechange', 'div:jqmData(role="page")', function(){
    console.log($.mobile.urlHistory.stack);
});

そこから、履歴に何があるべきかを確認し、必要に応じてクリーンアップすることができます。

私はこれを自分のナビゲーションレイヤーに多く使用して、urlHistory に保存されているものと保存してはならないものを変更しています。ブラウザとの同期は難しい部分です...

ブラウザーとの同期について:
私のナビゲーション レイヤーでは、urlHistory から二重のエントリを削除するだけなので、ブラウザーの [戻る] ボタンをクリックすると、(2 つではなく) 常に 1 つのページに移動します。あなたの場合、ブラウザの履歴に 4 つのエントリがあると思われますが、JQM urlHistory から 2 つのエントリを削除すると、戻るボタンをクリックしたときに「アクセスできない」ページが 2 つ表示されます。したがって、ブラウザの履歴が次のようになっている場合:

www.google.com
www.somePage.com
www.YOUR_APP.com = page1
    page2
    page3
    page4

そして、page2とpage3を削除し、戻るボタンをクリックすると、次のようになります。

1st back-click = page4 > page1
2nd back-click = page1 > www.somePage.com [because you removed page3]
3rd back-click = www.somePage.com > www.google.com [because you removed page2]

理論的な回避策は次のとおりです。

  1. ページにどれだけ「深く」入るかカウンターを保持する
  2. JQM urlHistory からページを削除し、「ジャンプ」値 = counter-removedPages を取得します
  3. 次のブラウザーの戻るクリックで、 jump x window.history(back) を実行し、JQM トランジションを 1 つだけ通過させます。URL は、page4>page3>page2>page1 を 1 つのステップでアンワインドし、JQM が page4 から page1 への単一の遷移のみを実行できるようにします。
  4. urlHistory の内容を確認し、「トリプルバック」後にクリーンアップします

これは最適な解決策ではなく、多くのことを考慮する必要があることに注意してください (ユーザーが戻る前に別の場所をクリックするなど)。私はこのようなものをより複雑なセットアップで機能させるために永遠に努力しましたが、最終的には使用をやめました。しかし、より単純なセットアップでは、非常にうまく機能する可能性があります。

于 2012-06-15T08:03:14.067 に答える
3

jQuery Mobile は、ページ間のナビゲーションにブラウザーの履歴を使用するため、ブラウザーでユーザーが戻るのを防ぐことは実際には不可能です。ただし、phonegap アプリがあるため、戻るボタンを直接処理できます。この質問はあなたを助けるはずです：Androidの戻るボタンの動作をオーバーライドするは、PhoneGapを使用した最初のページでのみ機能します

于 2012-06-04T16:04:23.043 に答える
2

これは単純な答えなので、そのように解釈する必要があります。単純に urlHistory.stack からアイテムを削除できます

delete $.mobile.urlHistory.stack[index_of_your_choosing];

正しいページが削除されていることを確認したい場合は、次のようにすることができます。

var stack_count = $.mobile.urlHistory.stack.length;

for(x=0; x<stack_count; x++){

  $.mobile.urlHistory.stack[x];

  if(typeof $.mobile.urlHistory.stack[x] !== 'undefined'){

    if($.mobile.urlHistory.stack[x].url != 'http://url-to-exclude.com/'){

       delete $.mobile.urlHistory.stack[x];

    }}
}
于 2013-11-15T18:43:18.087 に答える