pjax的な処理を書く際の自分用テンプレートその１

pjax_mytemplate.js

//------------------------------------------------------
// ページ読み込み
//------------------------------------------------------
window.onload(function(){
  //-------------------------------
  //パスを見て初期化処理振り分け
  //-------------------------------
  switch( location.pathname ){
    case '/page1':
      page1.init();
      page1.initEvent();
      break;

    case '/page2':
      page2.init();
      page2.initEvent();
      break;
    }

  //-------------------------------
  //ページ切り替え
  //-------------------------------
  $("#menu-page1").click(function(){
    UI.pageChange("page1");
  });
  $("#menu-page2").click(function(){
    UI.pageChange("page2");
  });
});

//------------------------------------------------------
//ページ1の処理
//------------------------------------------------------
var page1 = {
    'init': function(){ /* 最初の1回だけ実行する初期化処理*/ }
  , 'initEvent': function(){ /* ページが呼び出された回数分を実行 */ }

  , 'foo': function(){
    //そのほか必要な処理を記述
  }
}

//------------------------------------------------------
//ページ2の処理
//------------------------------------------------------
var page2 = {
    'init': function(){}
  , 'initEvent': function(){}

  , 'bar': function(){
    //そのほか必要な処理を記述
  }
}

//------------------------------------------------------
//ページ切り替え
//------------------------------------------------------
var UI = {
  'pageChange': function(target){
    //URL移動
    this.moveURL(target);

    //コンテンツ復帰処理
    this.restore(target);

    //再初期化
    switch( target ){
      case 'page1':
        page1.initEvent();
        break;
      case 'page2':
        page2.initEvent();
        break;
    }
  }

  
  , 'moveURL': function(target){
     //history API 呼んであれやこれや
  }

  , 'restore': function(target){
    //復帰処理など
    //初めての場合は $().load(); とかでとってくる
  }
}