アヤックス+バック＆フォワードボタン

Question

私は、新しいアプリケーションを作成するために開始して、完全なAJAXスタイルにしたい:)

てる私は、Ajaxリクエストをするためにjqueryのを使用しています。 メインのJSファイルは、リンクからいくつかの変数を取得し、そのリンクに応じていくつかのPHPファイルに行くいくつかのデータを取得し、準備されたHTMLタグにすべてを置きます。

これは私がこのアプリを見る方法です。

私はいくつかの解決策を見つけました。&フォワードボタンが機能し始めましたが、それらのソリューションでは、スクリプトはあらかじめ定義されたページに行き、いくつかの定数IDに従ってデータを読みます。私が欲しいもの

さ...

1. 私は、ユーザーが戻って押している場合はリロードページからブラウザを防ぐことができますいくつかのコード、進むボタン
2. を必要とし、我々は状態にあるのであれば、ブラウザの位置を覚えておいてください " C 'とバックがJSに値' B 'を持つ変数を渡すと、JSはPHPに行き、' B 'と言ってPHPがどのコンテンツを準備するかを理解するでしょう。コンテンツをJSに戻し、JSはページを更新し、誰もが幸せになれます。

このように機能するソリューションはありますか？

Answer 1

この目的でこれまでにjQuery BBQ: Back Button & Query Libraryを使用しました。

具体的には、basic AJAXの例は、あなたが何をしているかのように見えます。 examplesの残りの部分も同様に優れています。

Answer 2

backbone.js http://documentcloud.github.com/backbone/をご覧ください。それにはルータベースのアプリケーション構造がありますが、各ルートは実際には異なる/ urlです。

このようにアイテムリストがある場合は、route /＃itemsListに表示でき、各アイテムの詳細ページは/ items/idにある可能性があります。ナビゲーション全体があなたのために処理されます。あなたがしなければならないのは、そのURLにアクセスしたときに実行されるコードを貼り付けることです。に捕捉されるID 32と>アイテム - >ヘルプコード

www.myapp.com/#item/32 -

var Workspace = Backbone.Router.extend({ 

    routes: { 
    "help":     "help", // #help 
    "item/:id":  "item", // #item/myItemId 
    "itemList": "list" // #itemList 
    }, 

    help: function() { 
    ... show help 
    }, 

    item: function(id) { 
    ... show single item with jQuery, Ajax, jQuery UI etc 
    }, 

    itemList: function(){ 
    ... show item list with jQuery, jQuery UI etc. 
    } 

}); 

www.myapp.com/#help（例はhttp://documentcloud.github.com/backbone/#Router適応しました） （id）関数を呼び出し、Ajax経由でデータを取得するよう要求されます。

www.myapp.com/#itemList - >各アイテムの＃item/idでリンクを生成できるすべてのアイテムのリスト。