5

私は(https://github.com/browserstate/history.js)を使用し、このようなコードを持っています

History.Adapter.bind(window, 'statechange', function() { 
    var State = History.getState();
    alert('Inside History.Adapter.bind: ' + State.data.myData);
});

function manageHistory(url, data, uniqueId){
    var History = window.History;
    if ( !History.enabled ) { return false; }        
    History.replaceState({myData: data}, null, '?stateHistory=' + uniqueId);
}

manageHistory()ajax 呼び出しの後に呼び出すと、History.Adapter.bindコールバック メソッドが正しく呼び出されます。ただし、ブラウザーの [戻る] をクリックしてから [進む] ボタンをクリックすると、ページ ナビゲーションが B から A に移動し、次に A が Bに戻り、内部のコールバック メソッドHistory.Adapter.bindが呼び出されません。これは、chrome と IE9 の両方で発生します。この問題を修正する方法を知っている人は誰でもState、DOM を更新するために、クリックした後にブラウザーを元に戻し、次に進む必要があります。助けてください

注:html4ブラウザIE9にはバージョン1.7.1 jquery.history.jsを使用しています

更新 (2013 年 5 月 3 日): 私の要件についてもう少し話してください

申し訳ありませんが、他のタスクで忙しかったため、今までこの問題を確認する必要がありませんでした。そのoncompleteため、ajax 呼び出しで、返された情報を取得し、それを状態にプッシュしました。私の要件は、ページ A からページ B に移動し、次にページ B に移動する場合、DOM 操作を行う多数の ajax リクエストを実行することです (DOM 操作を行う各 ajax リクエストを a と呼びますstate)。戻るボタンをクリックするとページ A に戻り、進むボタンをクリックすると最後の状態のページ B に移動します。

だから私の考えは、oncomplete私のajaxリクエストについて、履歴の最後の状態を現在の状態に置き換えることでした(私のjsonオブジェクトは、ajaxリクエストから返されたhtmlです)。プッシュ状態を使用すると、ページ B にいてボタンを 1 つクリックすると、ページが に変わりaaa、I pushState になりaaaます。次に、他のボタンをクリックすると、ページbbbが pushState に変わりbbbます。ここで [戻る] ボタンをクリックすると、まだページ B にいて、状態がHistory.Adapter.bind(window, 'statechange', function() {})として表示されaaaます。[戻る] ボタンをもう一度クリックすると、ページ A に移動します。この動作は望ましくありません。state でページ B にいてbbb、戻るをクリックするとページ A に移動し、進むをクリックすると state でページ B に移動しますbbb。これがより理にかなっていることを願っています。助けてください

4

3 に答える 3

5

あなたがする必要があるのは次のとおりです:

  • 元のページが別のページである場合 (たとえば、ページ B を開いて、前のページがページ A だった場合)、 を実行しますpushState
  • 一方、前のページが現在のページと同じだった場合は、 を実行してreplaceState、情報を現在の状態に関する情報に置き換えます。

(変数で手動で行う必要がある前のページの追跡)

これは、A から B (pushState) に移動して B の新しい状態 (replaceState) に移動する場合、戻るボタン (A の状態情報に移動) および次に進む (B の最新の状態に移動) ことを意味します。さらに、A を初めて開いた場合、replaceStateA の状態に関する情報を使用して a を実行する必要があるため、A は少なくとも何らかの状態を保持します (そうしないと、空のデータ オブジェクトが保持されます)。

これは、順序付けられた履歴スタックを .js で構築する方法に関するものですpushStates。もちろん、あなたが望むものとはまったく異なりますが、少し簡単に記述されており、この回答の情報と合わせて、必要な動作が得られるはずです。

于 2013-05-03T10:04:55.627 に答える