複数のページにまたがってJavascriptの機能を共有する方法はありますか？

Question

OOPモデルでjavascriptがどのように動作するのか完全に理解していないので、私は知恵のためにオーバーフローをスタックするようになります。

私のコード例：

(function($) { 
var $container = $('#container'); 
var $sidebar = $('#sidebar'); 


// Sidebar 
var currTab = $('#s1'); 

if(currTab) { 
    currTab.parent().parent().parent().addClass('selectedTop'); 
    currTab.find(".sideContent").delay(300).slideToggle("slow"); 
    currTab.addClass('selected'); 
} 

$('#sideTop').delegate('li', 'hover', function(event) { 
    var $this = $(this); 
    if (event.type == 'mouseenter') { 
     if(!$this.hasClass("selected")){ 
      $this.siblings(".selected").children(".sideContent").toggle(); 
      $this.siblings(".selected").removeClass('selected'); 
      $this.find(".sideContent").toggle().addClass('selected'); 
      $this.addClass('selected'); 
     } 
    } 
}); 


})(this.jQuery); 

このコードは、私のコンテナやサイドバーのdivをキャッシュし、私のサイドバーのタブのホバリングを制御します。これらはすべてのページに表示されるので、最初はjsファイルを各ページに含めただけで、いつものように動作します。これで、サイドバーの特定のタブ（デフォルトではcurrTab変数で定義されています）を開いて、各ページをカスタマイズするようになりました。設定すると、デフォルトで開き、マウスがサイドバーを離れると開いたままになります。

サイドバーに関連するすべてのコードを完全に再ペーストする必要なく、各ページでcurrTabをカスタマイズする方法が見つかりませんでした。スクリプトを更新するのは面倒です。

これにどのようにアプローチすればよいですか？ありがとう

Answer 1

私は理解の私の欠如と混乱を引き起こしていることが残念ですが、related questionsの一つは、私が検索する方法を知らなかった方法で、鉱山に答え：

彼のセットアップA「クラス」を最初に、各ページに変更される値で、一貫性のあるコードをseperating、私はそれを試してみたし、それが完璧に動作jQuery.ClassName（オプション）

を使用して通信その後、別々のJSとして含めることができました。

(function($){ 
var undefined; 

$.ClassName = function(options){ 
    var self = this; 
    var cfg = $.extend(true, {}, this.defaults, options); 

    // ******************** 
    // start:private 
    // ******************** 
    function _init(){ 

    }; 

    // ******************** 
    // start:public 
    // ******************** 
    this.methodName = function(){ 

    }; 

    _init(); 
}; 

$.ClassName.prototype.defaults = {}; 
})(jQuery); 

Answer 2

クラスがあります。アクティブなタブに「currTab」などのクラスを追加するだけです。あなたのJSでは、タブでそのクラスをチェックし、タブが変更されたら、古いクラスからそのクラスを削除し、新しいクラスに追加します。

Answer 3

デフォルトでアクティブにするアイテムにクラスを追加します。 JSを使用してクラスを検出し、それに応じて反応します。

Answer 4

1つの方法は、各HTMLページ内でcurrTabを別々に宣言し、 "var currTab = $（ '＃s1'）;"を削除することです。あなたのJavaScriptファイルから。 JavaScriptファイル内の残りのcurrTabは、それを参照することができます。