我应该如何跨多个页面共享 Javascript 功能？

Question

我不完全理解 javascript 在 OOP model 中的工作原理，所以我来堆栈溢出以求智慧。

我的示例代码：

(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

很抱歉因我缺乏理解而造成混淆，但其中一个相关问题以我不知道如何搜索的方式回答了我的问题：

他首先设置了一个“类”，可以作为单独的 JS 包含，然后使用jQuery.ClassName(options)进行通信

我已经尝试过了，它工作得很好，将一致的代码与每页上会发生变化的值分开。

(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

带课。 只需将 class （例如“currTab”）添加到任何处于活动状态的选项卡即可。 在您的JS中，检查该ZA2F2ED4F8EBC2CBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBB40AB61DZ在选项卡上，然后更改选项卡时，请删除该ZA2F2ED4F8EBC2CBB4C21A21A21A29DC40AB61DZ，从旧产品中删除，并将其添加到新的一个。

Answer 3

将 class 添加到您要默认激活的项目。 使用JS检测class并做出相应反应。

Answer 4

一种方法是，在每个 HTML 页面内以不同方式声明 currTab，并删除“var currTab = $('#s1');” 从您的 JavaScript 文件中。 JavaScript 文件中 currTab 出现的 rest 仍然可以引用它。