WEBアプリケーション研究室 開発ノート TOP

WEBアプリケーション研究室 開発ノート [javascript]javascriptによる画面遷移とブラウザの戻るボタン

スポンサーサイト

-------- --:--

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

    このエントリーをはてなブックマークに追加

Ajaxやタブの切替などjavascriptで画面遷移をしたとき、ブラウザの「戻る」を押すとユーザーが期待したところと違うページに戻ります。それを防ぐテクニックとしてURLのハッシュ(#)を利用する方法があります。ちょっと前にGoogleの検索がAjaxになりましたが、Googleの検索もハッシュを利用しています。

javascriptで画面遷移をするときに


http://your.domain/page#tab=1
の様なURLにリンクして、ハッシュが変わったのをトリガーにスクリプトを動かします。画面の再読込は行われませんが、ブラウザの履歴には残っていきます。

しかし、javascriptにはハッシュが変更されたイベントがありません。そこで、役に立つのがjQueryプラグインの
hashchange
です。

ちらっとソースを見た感じでは、数十ミリ秒置きにチェックしているようです。イベントがあっても良さそうなもんですよね。

「戻る」だけではなく、検索結果や、特定のタブが選ばれた状態にリンクを貼ったり、URLを教えたり出来る利点もあります。
スポンサーサイト

    このエントリーをはてなブックマークに追加
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。