jquery 插件 $.extend

发布于 2024-08-14 12:47:31 字数 551 浏览 6 评论 0原文

如果我扩展 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);

我不知道如何编写在这种情况下“返回”

if i extend the jquery fn(like $.fn.extend) i write my plugin:

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

when i want to extend jQuery namespace i write it like this:

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

        }
    });
})(jQuery);

what i don't know is how to write the 'return' in this case

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

伤痕我心 2024-08-21 12:47:31

更新

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

$.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);

UPDATE

When you are doing multiple operations involving more than one selector, you have to decide what makes the most sense. If one selector is the primary focus, but effects other items as well, write it like a plugin, and return the primary result set like this:

$.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

If the selectors are all equal in importance, then simply create a function that does not return anything or returns true / false depending on success.

Another way to structure the code:

The extend method is used in other OOP frameworks and as you have shown, can be used with jQuery as well. What you will find, however, is many jQuery developers opt for the shorter more obvious syntax like this:

(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);
烟沫凡尘 2024-08-21 12:47:31

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

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

You can return whatever you like in the second instance. Forexample think of $.each() versus $.get(). However, if i were you i would avoid using this as a function namespace - it can lead to pollution. Instead you shoudl reserve this for add your own namespace under the jquery namespace like:

(function($){
    $.extend({
        myNamspace : {
          functionName: function(){
            // return whatever
          }
        }
    }});
})(jQuery);
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文