jquery插件$ .extend

时间:2009-12-14 00:46:48

标签: jquery plugins namespaces extend

如果我扩展jquery fn(如$ .fn.extend)我写我的插件:

(function($){
    $.fn.extend({
        functionName : function(){
             //function returns
             return this.each(function(){
                  $(this).append("<div>text</div>");
             });
        }
    });
})(jQuery);

当我想扩展jQuery命名空间时,我会这样写:

(function($){
    $.extend({
        functionName : function(){
             //function returns

        }
    });
})(jQuery);

我不知道的是如何在这种情况下写出'return'

2 个答案:

答案 0 :(得分:2)

您可以在第二个实例中返回您喜欢的任何内容。例如,考虑$.each()$.get()。但是,如果我是你,我会避免使用它作为函数命名空间 - 它可能导致污染。相反,你应该保留这个,以便在jquery命名空间下添加你自己的命名空间,如:

(function($){
    $.extend({
        myNamspace : {
          functionName: function(){
            // return whatever
          }
        }
    }});
})(jQuery);

答案 1 :(得分:2)

<强>更新

当您进行涉及多个选择器的多个操作时,您必须决定什么才是最有意义的。如果一个选择器是主要焦点,但也影响其他项,请将其写为插件,并返回主结果集,如下所示:

$.fn.myAction = function(secondarySelector){
      return this.each(function(){
          $(this).css('display', 'block');
          $(secondarySelector).hide();
      });
};

// Use:
// $(primarySelector).myAction(secondarySelector);
$("#id").myAction(".address"); // Chain continues after action

如果选择器的重要性相等,那么只需创建一个不返回任何内容的函数,或者根据成功返回true / false

构建代码的另一种方法:

extend方法在其他OOP框架中使用,如您所示,也可以与jQuery一起使用。然而,你会发现许多jQuery开发人员选择更短的更明显的语法:

(function($){

    // The if statement allows the file to be used with
    // other files that use the same shared namespace
    if(!$.Namespace){
        $.Namespace = { };
    };

    $.Namespace.Constructor = function( params ){
       ... code ...
    };

    // And for the wrapper sets ($.fn):
    $.fn.functionName = function(opts){
       return this.each(function(){
          ... code ...
       });
    };

})(jQuery);