jQuery history プラグイン
jQuery history plugin - Ajaxアプリで戻るボタンを押したときに、操作前の状態に戻すためのjQueryプラグイン
にて紹介いただきました.ありがとうございます.
この動作は、イベント発生時に履歴にURLを追加しておいて、戻るボタンが押されたときは、ブラウザのキャッシュを利用して操作前の状態に戻すという感じでしょうか?
動作原理ですが,
1.location.hashを書き換えて戻るボタンの履歴に残るようにする
2.iframeのopen/closeで履歴に残るようにする
の2つをブラウザによって使い分けることで実現しています.
上記をすると,#以降の部分を変更させたものを履歴に残すことができます.
戻るボタンを押すと,#以降が以前の状態に戻るので,#以降の部分が変化していないか定期的にチェックすることで戻ったことを判定しています.
Ajaxと戻るボタン・ブックマーク
に参考にしたリンクがあります.
というわけで,
うーん。URLに画面の状態を持っておくとうまくいくのだろうか。。。
その通りで,#以降の部分に画面の状態を持たせておいて,必要に応じて#以降の部分から画面の状態を復元できるように作る必要があります.
The comments to this entry are closed.
Comments
はじめまして。fnyaと申します。
疑問に丁寧にお答えいただきありがとうございます!
また、iframeのopen/closeで履歴に残るとは初めて知りました。
重ねてありがとうございます。
Posted by: fnya | Wednesday, April 04, 2007 11:39 PM
jQuery history プラグインの使用方法を
教えてください。
Posted by: sinh | Tuesday, May 22, 2007 12:55 PM
shinさん
http://www.mikage.to/jquery/jquery_history.html
のソースを参照してください.
・リンク先のページを #xxx にする
・$.historyInit() にコールバック関数を渡す
・ページが切り替わるとコールバックが呼ばれるので
ページの中身を書き換える
という感じです.
なお,Ajax使ったページがそのまま何もせず
戻るボタンに対応するわけではないので,
場合によっては既存ページの設計を見直す
必要性もあると思います.
Posted by: みかげ | Wednesday, May 23, 2007 09:26 AM
Hi,
I found a solution to the IE6 problems with location.hash. You can _check_ for it but not _set_ the value of it. So, in your code, search for:
var current_hash = location.hash
...and change to:
var current_hash = location.href.split('#')[1] || '';
This way you can remove the "To stop the callback firing twice during initilization if no hash present" part. It is causing problems with the titlebar (used when bookmarking pages) for both IE6 and IE7.
Oh, the same goes for var current_hash = iframe.location.hash; ... that must change to var current_hash = iframe.location.href.split('#')[1] || '';
Hope you understand what I mean, otherwise contact me and I'll send you a midified file.
cheers,
/Anton
Posted by: Anton Andreasson | Wednesday, September 24, 2008 12:34 AM
こんにちは、jquery.history 激しく便利に使わせて頂いております。
さて、一つ不具合らしき動作を見付けたのでご報告します。
Firefox3.0 にて発生を確認しました。
* <a href="#">hoge</a> なリンクを踏むと、callback 関数が二回呼ばれる
* $.historyLoad("") を実行すると、callback 関数が二回呼ばれる
以下の変更で、この現象が解決される事を確認しました。
よろしくお願いします。
--- jquery.history.js.old 2007-02-15 22:43:05.000000000 +0900
+++ jquery.history.js 2008-11-21 17:21:48.000000000 +0900
@@ -116,7 +116,13 @@
newhash = '#' + hash;
location.hash = newhash;
}
- jQuery.historyCurrentHash = newhash;
+
+ if(jQuery.browser.msie) {
+ jQuery.historyCurrentHash = newhash;
+ }
+ else {
+ jQuery.historyCurrentHash = hash;
+ }
if(jQuery.browser.msie) {
var ihistory = $("#jQuery_history")[0];
Posted by: takayama | Friday, November 21, 2008 05:34 PM
jQuery history プラグイン便利です!
ただし、IE6でクリック音が複数回鳴ってしまうのが残念です!
Posted by: history plugin便利! | Monday, December 22, 2008 10:59 PM
To Anton
I am sorry though it doesn't confirm for a long time.
I adopted your proposal by a new version.
Thank, you.
Posted by: mikage | Friday, March 20, 2009 06:34 PM
To takayama さん
すごくお返事が遅くてすいません.
直そうと思いつつ忘れたままになっていました.
パッチありがとうございます.
その前に書かれている Anton さんのパッチでも
問題が解消されるようですので,先に書かれていた
Anton さんのパッチの方を最新版で適用させていただきました.
Posted by: 沢渡 みかげ | Friday, March 20, 2009 06:36 PM