Ajaxで取得した検索結果を遷移先から戻っても保持したい

Question

hoge.htmlにあるでテキスト検索で「ほげ」という文字列で検索を実行します

検索結果はAjaxでDBから取得して来た「ほげ」を含むものの一覧

その一覧の中のhogeというものをクリックし、ページhogeに遷移する

その後、ページhogeからブラウザの戻るボタンでhoge.htmlにもどっても

検索文字列「ほげ」や検索結果の「ほげ」を含むものの一覧を表示させたい

現在は検索前の画面にもどっている状況です
※検索文字列も検索結果もない

何か方法はありますか？

出来ればhoge.htmlのままで可能にしたいです

Comments

[退会済みユーザー]

回答者の環境でその現象を確認できるミニマムソースを提示してください。

Answer 1

Cookie か localStorage に保存して、そこに値があったら検索をするようにすれば出来ると思います。localStorage はIE8以降であればどのブラウザでも使えます。Cookie は使えないブラウザはほとんどありません。

【[Cookie・WebStorage]ブラウザにデータを保存する - Qiita】
http://qiita.com/shuntaro_tamura/items/004a2c8fb42f107d88e3

Answer 2

historyAPIを使用することで実現可能です。
pushStateやpopStateを使うことで検索結果などを裏で保持しておくことができます。

Comments

[hyksm]

これはHTML5でしか動きませんか？

[ShoheiTai]

HTML5ですね。モダンブラウザでは基本的に動作するかと思います。
対応ブラウザは以下に記載されています。
http://caniuse.com/#feat=history