1

取引記録のリスト (1 ページあたり 10 レコード) を表示する Web サイトに取り組んでいます。

このページにはページング検索機能があり、ユーザーは特定のトランザクション レコードを表示できます (日付範囲、タイプなど、最大 10 個以上のパラメーター)。

ユーザーが何かをクリックすると (ページ/検索条件の変更)、ajax 呼び出しを使用して、リロードせずにトランザクションをフェッチして表示します。

ただし、ユーザーが次のページ (ajax 呼び出し) をクリックして page2 を表示し、ブラウザの戻るボタンをクリックしようとするとします。サイトは、ページ 1 に戻るのではなく、別の Web ページにリダイレクトします。

window.history.pushStatechrome/Firefox で html5 にリロードせずに URL を変更する方法があることは知っています。ただし、IE7+/FF/Chrome/Safari などの古いブラウザーをサポートする必要があります。

この問題を解決する既存のソリューションはありますか? ありがとう。


編集: 正午に history.js を試しました。

// newUrl: "?para1=value1¶2=value2&....

history.pushState({data:"searchTransaction"}, document.title, newUrl);

また、ajax リクエスト後に URL が変更されました。そして、変更イベントを処理する方法に問題があります。back/next (ユーザー クリック) イベントをバインドして "newUrl" を取得し、それを解析してパラメーター マップに戻し、ajax リクエストを再度実行したいと考えています。そして、できればpushState時にパラメータ配列全体を保存したいです。

4

1 に答える 1

1

残念ながら、'back/next' イベントは存在しないためキャッチできませんが、statechangeはキャッチできます。

// Bind to StateChange Event
History.Adapter.bind(window,'statechange',function(){ // Note: We are using statechange instead of popstate
    var State = History.getState(); // Note: We are using History.getState() instead of event.state
    History.log(State.data, State.title, State.url);
});

私が通常行うことは、ユーザーのクリックをキャッチすることです.statechangeがクリックなしでトリガーされた場合、ユーザーは次または戻ると思います。

于 2013-01-21T10:27:35.830 に答える